Kuroko's Development Notes

前端二维码生成框架比对：vue-qr VS vue-qrcode，以及对文档截图生成图片的html2canvas使用介绍，FileSaver.js 将图片下载本地的介绍。

当前项目是一个多页应用配置，将路由从默认的hash模式改为history模式之后，本地开发环境刷新页面404

vue3开发过程中，绑定的响应式数据失去了响应式，如何排查定位问题？持续请求的数据变动之后，控制台输出绑定的响应式变量 mapObj 的确变了，但是视图上只更新了一次，后续就不再更新了。

演示预览：点击查看效果演示代码：点击查看代码官方教程：https://vue-particles.netlify.com/具体步骤如下1、安装插件npm install vue-particles --save-dev2、引入插件import Vue from 'vue'import VueParticles from 'vue-particles'Vue....

watch 与 computed 的区别，最关键的是watch需要监听值的变化而改变，但是computed从一开始就可以达到和某个值关联起来。

情景描述:在使用 element ui 的el-table 组件时，表头进行v-if判断来动态显示，正常来说这样的操作时没得任何毛病的，但是如果在这基础上使用 <template slot-scope="scope"> 操作的话，表头一旦切换就会报错，错误信息如下图： 解决办法如图：解释一下：这是因为在v-for或者v-if切换标签时，多个相同的标签被渲染，...

第一种如图：打包后的index.html加载资源失败 > 提示报路径错误 > 需要我们对build操作进行一些path上的调整！具体如下：1、静态资源的绝对路径改为相对路径config --> index.js --> build:{  assetsPublicPath: './'  }  注意斜杠前面多加一个点哦2、添加图片资源的访问路...

一、常用配置先附上本人常用配置，在 .eslintrc.js 文件中：rules: { 'no-console': process.env.NODE_ENV === 'production' ? 'error' : 'off', // allow console during development 'no-debugger': process.env.NODE_ENV ...

官方介绍：https://www.npmjs.com/package/vue-qr1、安装npm install vue-qr --save2、导入vue项目中使用下面给出一个简单的demo<template> <vue-qr :text="downloadData.url" :margin="0" colorDark="#f67b29" colorL...

1、效果展示2、实现代码在components目录下，新建组件 myImgUpload.vue，代码如下：<template> <div> <el-upload :class="disabled ? 'hideAdd' : 'showAdd'" ref="myImgUpload"...

1、效果演示管理后台系统模板-预览2、重点内容1. 用户登录态的实现 - cookie2. 本地mock数据方式 - EasyMock/ExpressMock/MockJs/YapiMock/本地拦截3. 前端请求做了哪些事情 - axios4. 前端路由模式 - vueRouter5. 表单校验交互 - veeValidate6. 列表查询的UI和交互 - elem...

1、使用场景如图，我要在登录、注册两个不同tab页进行各自的表单校验。2、关键代码展示template部分：<div class="login-panel" v-show="activeTab === 1"> <div class="panel-content"> <div class="login-account-inp.

1、问题描述项目之前正常的路由配置是这样的： 2、路由配置说明第一种做法：每个页面模块目录通过一个 index.js 主入口来导出（module.exports）对应的vue文件，然后 router.js 中通过 require 方法去引入资源。这一做法是没毛病的，因为这是组织（webpack 2）允许的。第二种做法：如果好好的require不用，非要用 i...

方法：利用el-menu 自带属性 default-active 匹配当前路由 $route.path实例：<el-menu:unique-opened="true":router="true":collapse="isCollapse"class="elMenu"text-color="#fff"background-color="#37363B"

一、效果演示a.测试界面初始化b.点击【上传视频】c.点击【开始上传】d.点击【上传音频】选择音频之后点击【开始上传】c.点击【上传图片】，注意图片上传为单按钮，选择文件之后自动完成上传d.点击【确定】来获取以上几个上传文件成功之后返回的最关键的key值注：其中音视频我们取其videoId，图片取url 二、测试页面代码此处，先展示上...

咱们今天说说VUE路由的hash模式与history模式的区别，这个也是面试常问的问题，不要小看这道题其实问到这里的时候那个面试官应该是个大牛，开发经验丰富，这个题其实就是考验你的开发经验是否属实。咱们来看看小白的回答。小白回答：hash模式url带#号，history模式不带#号。回答总结：这个回答其实和没有回答是一样，百度一下都知道了，官网文档也有，如果这样回答就能通过，那么那个...

第一步 安装 node网上下载一下node即可，下一步下一步点去就行，查看是否成功：cmd——node -v 第二步 安装 npm此处用的是淘宝镜像 cnpmnpm install -g cnpm --registry=https://registry.npm.taobao.org 第三步 安装 vue-clicnpm install -g vue-cli ...

直接上例子，以vue应用为例：html: <ul>      <li v-for="item in items" :class="{finished:item.isFinished}" @click="toggleFinish(item)"      @touchstart="touchstart()" @touchmove="touchmove(item)&quo

故事前景：vue中子组件向父组件传递数据的方式为：使用 $on(eventName) 监听事件使用 $emit(eventName)触发事件而当我们自己写一个子组件时，往往用这句代码：this.$emit('input', value)通过触发input事件来传递value给父组件，那么问题来了，此处为何传的是'input'？？？ 完美解读：  真相...

after{target} - 比target要大的一个合法日期，格式(DD/MM/YYYY)alpha - 只包含英文字符alpha_dash - 可以包含英文、数字、下划线、破折号alpha_num - 可以包含英文和数字before:{target} - 和after相反between:{min},{max} - 在min和max之间的数字confirmed:{target} - 必须和ta...

<el-input size="medium" v-model.trim="account" placeholder="提取金额" :maxlength="inputMaxL"  @input="inputMaxL = /^\d+\.?\d{0,1}$/.test(account) ? null : account.length - 1"></el-input&amp

 Vue所有的生命周期钩子自动绑定在this上下文到实例中，因此你可以访问数据，对属性和方法进行运算。这意味着你不能使用箭头函数来定义一个生命周期方法。这是因为箭头函数绑定了父上下文，因此this与你期待的Vue实例不同。1、beforeCreate　　在实例初始化之后，数据观测和event/watcher时间配置之前被调用。2、created　　实例已经创建完成之后被调用。在...

vue运行为v-on在监听键盘事件时，添加了特殊的键盘修饰符：<input v-on:keyup.13="submit">vue还非常贴心地给出了常用按键的别名，这样就不必去记keyCode ~ ~上面代码，还可以在这样写： <input v-on:keyup.enter="submit"><input @keyup.enter="submit...

加冒号的，说明后面的是一个变量或者表达式；没加冒号的后面就是对应的字符串字面量！ 例子：<el-radio-group v-model="handle">                    <el-radio :label="true">打开</el-radio>                    <el-radio :labe...

一、问题描述用户在用夜神安卓模拟器时打开我方APP时，H5页面显示空白！ 二、问题分析因为模拟器的系统版本过低，现在安卓系统已经到8了，但是夜神模拟器的系统还是4.4。所以浏览器版本也过低，不支持我们目前的写法。 三、解决方案1.cnpm安装cnpm i babel-polyfill --savecnpm i es6-promise --save 2.m...

git clone 与vue init 相爱相杀首先，我在git上新建了一个项目 leke-operation。然后，我在本地clone了这个项目 leke-operation。接着，我在本地的这个项目（目前是一个空文件夹 leke-operation）执行命令 vue init webpack leke-operation这会儿你会很fu*k的遇到vue初始化命名必须输入项目名，...

旧版： "vee-validate": "^2.0.0-rc.13"新版："vee-validate": "^2.1.0-beta.7"安装最新版的VeeValidate之后对其进行中文化操作时，之前老一套（2.0版）中文化的做法如下图：系统报错提示 addLocale 是不存在的，所以这个时候，要么将版本降低至2.0版，要么就再安装一个玩意儿：vue-i18n执行命令 y...

web技术选型参考：1、框架自身是否成熟2、生态系统是否完善3、是否满足项目需求 目前常见的主流技术参考，根据github关注度排名：架构框架框架名 技术支持 思想 针对性 React Facebook 虚拟dom，单项数据流 高效创建交互式组件 Vue Evan You（尤雨溪） 轻量级AngularJs ...

问题描述：npm run build 后dist文件夹下面直接浏览器打开index.html，css和js的路径都不正确。 放到跟目录下就正常了。 问题解决：打开项目所在文件夹里面的 config - index.js  在 build 部分的 assetsPublicPath 里面加一个点即可assetsPublicPath: '/', 改为assets...