vue自定义指令 directive
directive全局注册自定义指令 Vue.directive// 注册一个全局自定义指令 `v-focus` Vue.directive('focus', { // 当被绑定的元素插入到 DOM 中时…… inserted: function (el) { // 聚焦元素 el.focus() } }) 注册局部自定义指令directives: { focus: { // 指令的定义 inserted: function (el) { el.focus() } } } 钩子函数bind只调用一次，指令第一次绑定到元素时调用。在这里可以进行一次性的初始化设置。 inserted被绑定元素插入父节点时调用 (仅保证父节点存在，但不..
更多vue过滤器 filter
过滤器使用<!-- 在双花括号中 --> {{ message | capitalize }} <!-- 带参过滤器 --> {{ message | filterA('arg1', arg2) }} <!-- 在 `v-bind` 中 --> <div v-bind:id="rawId | formatId"></div> 自定义过滤器 实例注册 filters: { capitalize: function (value) { if (!value) return '' value = value.toString() return value.charAt(0).toUpperCase() + value...
更多Vue 插槽
例子// 定义组件my-component <p class="myComponent"> <slot name="mySlot"></slot> </p> <!-- 使用组件 --> <my-component> 插槽内容 </<my-component>> 后备内容 在slot组件内设置后备内容,当没有提供任何插槽内容时 渲染后备内容 <!-- 在slot组件内设置后备内容 --> <button type="submit"> <slot>Submit</slot> </button> <!-- 当没有提供任何插槽内容时 渲染后..
更多Vue插件
介绍插件就是给Vue添加全局功能 install vue插件应该暴露一个install方法。此方法调用时，将Vue构造函数作为第一个参数传入，以及将一个可选的选项作为第二个参数传入 Plugin.install = function(Vue, options) { // 1. 添加全局方法或属性 Vue.myGlobalMethod = function () { // 一些逻辑…… } // 2. 添加一个全局资源(asset) Vue.directive('my-directive', { bind (el, binding, vnode, oldVnode) { // 一些逻辑…… } ... }) // 3. 注入一..
更多vuex辅助函数
mapState 当一个组件需要获取多个状态时候，将这些状态都声明为计算属性会有些重复和冗余。 原本 computed: { count () { return this.$store.state.count }, count1 () { return this.$store.state.count }, count2 () { return this.$store.state.count }, count3 () { return this.$store.state.count } } 现在 computed: mapState({ // 箭头函数可使代码更简练 count: ..
更多