1. 混入
混入规定:当组件和混入对象有同名选项时,这些选项会以失当的形式进行合并。 (1) 数据data 数据对象在混入时,会进行合并,发生冲突时,保留组件的数据 (2) 值为对象methods,computed等 在混入时,同名的methods会合并成为一个对象,如果对象的键名发生冲突,则保留组件对象的键值对 (3) 生命周期钩子函数 同名的钩子函数会被合并为一个数组,顺次都会被调用,然而混入对象的钩子函数先被调用。全局混入 Vue.mixin(mixin)部分混入 let vm = new Vue({ el:"#app", //部分混入 mixins: [mixin] })
2. 自定义指令
指令外部有5个钩子函数(1) bind(el, binding, vnode, oldVnode){} //绑定的时候调用一次(2) inserted(el, binding, vnode, oldVnode){} //当节点追加到父节点上调用(3) update(el, binding, vnode, oldVnode){} //vnode更新(4) componentUpdated(el, binding, vnode, oldVnode){} //组件更新调用(5) unbind(el, binding, vnode, oldVnode){} //解绑的时候调用一次 每个钩子函数外部都有4个形参 el 以后指令绑定的dom对象 binding 以后值绑定指令的详细信息 vNode Vue编译生成的虚构dom节点 oldNode 上一个虚构dom节点,只有在update和componentUpdated这两个钩子触发时,该参数才有实参。
3. 过滤器
Vue.js容许自定义过滤器,可被用于一些常见的文本格式化。过滤器能够用在两个中央:双花括号插值和v-bind表达式。过滤器应该被增加在JavaScript表达式的尾部,由管道 "|"符号批示。在双花括号中 {{ message | filterMethod }}在v-bind中 <div :title="new Date() | fmtDate_global">鼠标悬停查看工夫 </div>首先引入'moment'第三方库,再进行接下来的操作。引入moment仅供实现性能,与过滤器没有关系。<script src="https://cdn.bootcdn.net/ajax/libs/moment.js/2.29.1/locale/af.js"> </script><script> //全局注册 Vue.filter("fmtDate_global", function(date){ return moment(date).format("YYYY-MM-DD HH:mm:ss"); //或者return本人编写的工夫处理函数 })</script>全局注册 Vue.filter("fmtDate", (val)=>{ return ...val })部分注册 filters: { fmtDate(val){ return ...val } }
4. render函数
render(createElement){ return createElement(nodeName, props, childVnode)}createElement函数外部参数阐明 nodeName: 标签名 props: 该元素的配置信息 'class' , style, attrs, props, domProps, On, nativeOn childVnode: 子虚构节点,个别为数组,示意其子元素有多个
5. plugin插件
plugin插件须要提供一个install办法在vue实例构建之前去调用该插件保障创立进去的vue实例可能拜访插件中的全局办法或属性Vue.user(MyPlugin)let vm = new Vue({})