看板.md

#npm install 报错的情况下
可以先清理缓存：npm cache clean --force
然后升级版本:npm install -g npm
重新安装: npm install -g cnpm --registry=http://registry.npm.taobao.org
一次不行可以反复几次，就可以进行npm install操作了

#命令删除node_modules
npm install rimraf -g
rimraf node_modules
npm install/cnpm install

重新安装依赖后，需要重新cnpm install --save video.js

#datav使用教程：
下载：npm install @jiaminghi/data-view / npm install --save @jiaminghi/data-view
全局引用：
import dataV from ‘@jiaminghi/data-view’
Vue.use(dataV)
按需引入：
import { borderBox1 } from ‘@jiaminghi/data-view’
Vue.use(borderBox1)

#父子组件之间的传值： https://www.cnblogs.com/vickylinj/p/10877765.html
=====父传子：父：v-bind:valuekey1=“value”
子：props:{
valuekey1:{
type:Array,
default:’’
},
valuekey2:{
type:Array,
default:’’
}
}

=====子传父：
子：this.$emit(‘methodname’,value);
父组件：< @methodname=‘fathermethod’ />
fathermethod(value) {value就是子组件传过来的值}

======兄弟组件之间：通过vuex，或者eventBus(通过on监听，emit触发的方式)：
组件A： < @click=‘emitToB’ />
emitToB() {
eventBus.KaTeX parse error: Expected 'EOF', got '}' at position 26: …tFromA',要传递的值) }̲ 组件B： mounted:…on(‘eventFromA’,function(val) {
that.title = val;
})
}
}

#sync修饰符
https://cn.vuejs.org/v2/guide/components-custom-events.html#sync-%E4%BF%AE%E9%A5%B0%E7%AC%A6
双向数据绑定，存在维护上的问题。没有明显的数据变更来源，使用sync可以避免
子组件向父组件传值，父组件绑定响应数据，:属性名+.sync
:title.sync=“zhantitle”

#v-model / v-bind 区别

#路由跳转
this.$router.push{(}^{\prime }/hom{e}^{\prime })this.$router.push({name:‘home’})
this.$router.push({path:’/home’})

#vue中使用bootstrap，bootstrap基于jquery框架：
npm install jquery --save
npm install bootstrap --save
npm install popper.js --save
完了在main.js总引入 import ‘bootstrap’
import $ from ‘jquery’
如果cli版本低于V3 配置webpack.base.conf.js: https://segmentfault.com/a/1190000014509984
css需要手动引入：在相关的vue文件中添加如下代码
import ‘bootstrap/dist/css/bootstrap.min.css’
import ‘bootstrap/dist/js/bootstrap.min’
import ‘bootstrap/dist/js/bootstrap.min.js’

使用echarts

cnpm install echarts --save
在main.js全局引用：
import echarts from “echarts”;
Vue.prototype.$echarts = echarts;

import echarts from ‘echarts/lib/echarts’
// 引入提示框组件、标题组件、工具箱组件。
import ‘echarts/lib/component/tooltip’
import ‘echarts/lib/component/title’
import ‘echarts/lib/component/toolbox’
Vue.prototype.$echarts = echarts

使用echarts步骤：
1，给一个一定宽高的div盒子
2，echarts.init()初始化一个实例
3，setOptions({}) 将图表数据放进去

#vue项目中引入视频
cnpm install video.js
在main.js中引入：
import Video from ‘video.js’
import ‘video.js/dist/video-js.css’
Vue.prototype.$video = Video;
在组件中使用：

your browser does not support the video tag

#使用全局过滤器 / 局部过滤器 使用时通过插值表达式{{ name | 过滤器的名称 }}或者v-bind
--------全局过滤器
Vue.filter(‘publicfilter’,function(data,params) {//过滤器可以接受多个参数，可以连续调用多个过滤器,直接累加管道符和过滤器就行
var a = data.replace(/h/g,params);//替换 正则表达式，两个斜杠表示开头和结尾，g表示全局匹配
return a + ‘全局过滤器的基本使用’;
})
--------局部过滤器
filters:{//定义局部过滤器
filter1() {

},
filter2() {

}

}

#使用全部指令/私有指令 使用时加上V-
-------全局指令
Vue.directive(‘color’,{
bind:function(el) {//和样式相关的最好写在bind中；和js行为相关的最好写在inserted中【防止js行为不生效】。
el.style.color=‘red’;
},
})
-------私有指令
directives:{//自定义私有指令
‘fontweight’:{
bind:function(el,binding) {
el.style.fontWeight = binding.value;
}
},
‘fontsize’: function(el,binding){
el.style.fontsize = parseInt(binding.value) + ‘px’;
}
}

#在vue中操作数据，不提倡操作DOM，而jquery是操作DOM的，所以在vue中一般不使用jquery

#在vue中引入quasar：
cnpm install -g @quasar/cli
cnpm install 启动quasar项目：quasar dev
main.js中引入
import quasar from ‘quasar’
Vue.use(quasar)

#quasard中英文对照文档
https://blog.csdn.net/liub37/article/details/83344994?utm_medium=distribute.pc_aggpage_search_result.none-task-blog-2_allfirst_rank_v2~rank_v25-1-83344994.nonecase&utm_term=vue%E5%BC%95%E5%85%A5quasar