vue API 2.x重点笔记

全局配置

Vue.config.silent          取消 Vue 所有的日志与警告。没必要动他            
Vue.config.optionMergeStrategies
Vue.config.devtools        是否允许vue调试工具devtools的使用。开发默认true、生产环境默认设置false
Vue.config.errorHandler   
Vue.config.warnHandler
Vue.config.ignoredElements
Vue.config.keyCodes
Vue.config.performance
Vue.config.productionTip  是否启动时生成生产提示。一般为false关掉、免得碍眼

全局api

Vue.extend
Vue.nextTick     这个一般用局部的。全局指定vue的dom节点挂载完成再执行其中的方法
Vue.set
Vue.delete
Vue.directive    全局自定以指令添加。使用场景比如：图片加载完成之前的暂时情况设置，避免网络卡
Vue.filter       全局过滤器添加。vue3.x全局过滤器只能加在原型中（原型新写法：app.config.globalProperties.）。vue3.x开始建议用computed替代局部过滤器
Vue.component    全局组件添加
Vue.use          全局插件使用。比如vue-router、elementui等
Vue.mixin        全局导入vue实例中scrpit部分的代码。用于代码复用。子组件中可通过mixin属性直接使用
Vue.compile 
Vue.observable
Vue.version      查看当前vue版本

vue组件的配置

• 即vue文件中script标签中的，export default 部分配置

数据相关
	data          数据
	props         接收父组件传递的数据。可以是数组或对象
	computed      计算属性
	watch         监听数据。函数参数必有val, oldVal 新老数据。
	methods       方法
	propsData
	
dom节点相关
	el           vue渲染完成后替换（又名挂载）的dom节点
	template     即标签template部分写在了配置中
	render       dom节点新老替换过程中执行的方法
	renderError  render渲染出错时执行的方法。结合热重载使用，提高开发效率
	
生命周期相关
	beforeCreate     无法获取数据。只是单纯的开始加载此组件
	created          数据获取完毕。
	beforeMount      替换（挂载）dom节点之前。无法获取新dom节点
	mounted          替换（挂载）dom节点之后。
	beforeUpdate      修改前
	updated			  修改后
	beforeDestroy	  删除前
	destroyed		  删除后
	activated         配合keep-alive使用
	deactivated       配合keep-alive使用
	errorCaptured     用于组件报错的
	
自定义相关
	directives   自定义局部指令。vue3.x开始替换bind、inserted等(vue2.x)为created、mounted等
	filters      自定义局部过滤器。vue3.x开始就不用了，推荐computed更省事
	components   引用其他组件。
	
选项 / 组合
	parent
	mixins				导入的script中的配置合并在当前vue配置（如有雷同，保留当前原配置）
	extends
	provide / inject
选项 / 其它
	name			配合vue-devtools调试、通过组件名找数据更快
	delimiters
	functional
	model     定制v-model时使用。v-model本质就是props跟$emit组件通信，但一个标签只能用一次v-model
	inheritAttrs
	comments

vue实例

• 与vue组件的配置大同小异。vue实例 = vue内script标签 + template标签 + style标签 总体
  还种说法就是比vue的配置选项只是vue实例的一部分

vue实例的参数
	vm.$data          	
	vm.$props			
	vm.$el				vue实例挂载的点
	vm.$options         
	vm.$parent
	vm.$root
	vm.$children
	vm.$slots
	vm.$scopedSlots
	vm.$refs
	vm.$isServer
	vm.$attrs
	vm.$listeners
vue实例的方法 --- 数据相关
	vm.$watch
	vm.$set
	vm.$delete
vue实例的方法 --- 事件相关
	vm.$on				监听自定义事件---与vm.$emit配合使用、可跨组件通信、必须是同一个vue实例（vue的prototype原型中可以添加）
	vm.$once			监听自定义事件，只触发一次
	vm.$off				移除自定义监听事件
	vm.$emit			触发当前实例上的自定义事件
vue实例的方法 --- 生命周期相关
	vm.$mount 			vue实例替换（挂载）指定dom节点（此dom节点一般默认是app.vue主入口，因为是单页面应用）。在main.js默认js入口可见使用
	vm.$forceUpdate		
	vm.$nextTick		vue实例挂载完成之后才回调里面的方法
	vm.$destroy			完全销毁vue实例。触发beforeDestroy跟destroyed生命周期钩子。最好不用。建议用v-if代替

指令

v-text			标签内容权当文档编译
v-html			标签内容权当html内容编译
v-show			控制显示与隐藏。通过display行间样式。建议操作频繁时使用
v-if			控制有无；通过增删节点。建议操作不频繁时使用
v-else			..
v-else-if		..
v-for			遍历。配合:key使用
v-on			事件绑定
v-bind			动态绑定属性获取值
v-model			双向绑定
v-slot			
v-pre			跳过编译。原样显示{{message}}等动态数据
v-cloak			编译结束后才显示。避免原样显示{{message}}等动态数据
v-once			只渲染一次

特殊属性

key				与v-for配合使用
ref				用于获取节点，配合vm.$refs
is				动态组件<component:is="comp"></component> 通过控制comp动态给组件命名。根据需要配合keep-alive使用可缓存组件。避免多次渲染
slot			插槽。匿名插槽和具名插槽。vue3.x开始废弃，推荐用v-slot
slot-scope     	作用域插槽。table表格等可以用到。vue3.x开始废弃，推荐用v-slot
scope			已经废弃

内置组件

component			用于动态组件。配合:is使用
transition			过渡组件。操作单个组件。将需要操作的单个组件放在里面。搞炫酷动画效果的
transition-group	过渡组件。操作多个组件。里面可以操作多个组件。搞炫酷动画效果的
keep-alive			缓存组件。其中的组件都只会渲染一次
slot				插槽