vue 全家桶（六）全局注册过滤器filter和全局注册组件

最新推荐文章于 2024-09-05 13:30:00 发布

胡小方

最新推荐文章于 2024-09-05 13:30:00 发布

阅读量1.3k

点赞数 1

分类专栏： vue vue 文章标签： vue

本文链接：https://blog.csdn.net/try_try_try/article/details/85264175

版权

本文介绍了如何在Vue应用中以更优雅的方式全局注册过滤器和组件。通过在src/assets/js下创建filters.js来定义全局过滤器，并在main.js中导入注册。同样，可以在components文件夹下创建globalComponent.js来集中管理全局组件，然后在main.js中引入，避免在main.js中直接大量编写注册代码。

摘要由CSDN通过智能技术生成

虽然在main.js中使用 Vue.filter()和Vue.component() 就可以实现全局注册的问题，但是注册全局组件是挂载在Vue对象下，也就是全写在main.js中咯，那会不会多了点，本文主要是提供一个小优雅的方案咯。

一. 全局注册过滤器

1. src>assets>js 下创建一个filters.js文件，写下我们全局的过滤器，然后将其抛出。

//事件过滤器
let formatDate = function (date, fmt){
  if(typeof(date)!='Date'){
    date = new Date(date);
  }
  if (/(y+)/.test(fmt)) {
    fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length));
  }
  let o = {
    'M+': date.getMonth() + 1,
    'd+': date.getDate(),
    'h+': date.getHours(),
    'm+': date.getMinutes(),
    's+': date.getSeconds()
  };
  for (let k in o) {
    if (new RegExp(`(${k})`).test(fmt)) {
      let str = o[k] + '';
      fmt = fmt.replace(RegExp.$1, (R