vue组件和过滤器统一注册的方法

181 阅读1分钟

vue组件和过滤器统一注册的方法

为了方便所有的页面都可以不用引用该组件,可以进行全局注册

提供注册入口 src/componets/index.js

// 该文件负责所有的公共的组件的全局注册   Vue.use
import PageTools from './PageTools'
export default {
  install(Vue) {
    //  注册全局的通用栏组件对象
    Vue.component('PageTools', PageTools)
  }
}

在入口处进行注册 src/main.js

import Component from '@/components'
Vue.use(Component) // 注册自己的插件

在**main.js**中将工具方法转化成过滤器

import * as filters from '@/filters' // 引入工具类
// 注册全局的过滤器
Object.keys(filters).forEach(key => {
  // 注册过滤器
  Vue.filter(key, filters[key])
})

好了,现在可以愉快的用过滤器的方式使用工具类的方法了

       <el-table-column label="时间"  align="center">
            <!-- 作用域插槽 -->
            <template slot-scope="{ row }">{{ row.timeOfEntry | formatDate }}</template>
       </el-table-column>

这是组件和过滤器方法的全局注册

小结

这样我们就可以来做我们的项目了, js高程第四版链接: pan.baidu.com/s/18P8ky1Ya… 可以加公众号获取提取码.

若有不懂的地方,请加q群147936127交流或者vx: ltby52119,谢谢~

公众号.png