vue 将多个过滤器封装到一个文件中

最新推荐文章于 2023-04-24 14:13:26 发布

叫我火柴

最新推荐文章于 2023-04-24 14:13:26 发布

阅读量365

点赞数

分类专栏： vue 文章标签： vue.js html html5 css

本文链接：https://blog.csdn.net/weixin_44283571/article/details/108388824

版权

本文介绍了如何在Vue项目中将过滤器封装到单独的文件中以实现复用。具体步骤包括创建filters.vue文件定义过滤器，如MoneyFormat和timeFilter，然后在filters/index.js中封装这两个过滤器。在main.js中引入全局过滤器，使得过滤器可以在项目中被多个组件调用。这样做可以提高代码的组织性和可维护性。

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

在这里只简单探讨关于如何将vue过滤器封装到一个文件当中，当然可以封装多个不同类型的过滤器，然后可以在需要使用过滤器的文件当中进行复用，非常的方便。
1.
首先涉及到 filters.vue (引用过滤器的文件),其中MoneyFormat就是一个过滤器，其的写法是写在需要过滤的变量的后面并用"|"隔开，当这么写时就可以将texts这个变量传入到MoneyFormat这个过滤器里进行相应的处理
在这里插入图片描述
文件代码：

<template>
  <div class="chart-container">
    <ul>
       <li v-for="texts in text" >{
   {
   texts | MoneyFormat}}</li>
    </ul>
  </div>
</template