您现在的位置是：网站首页>软件开发>开发终端>uni-appuni-app

uniapp规范开发（8）使用过滤器filter

风口下的猪2020-08-28【uni-app】

简介

平时我们在vue中使用过滤器时，在组件中定义的过滤器不能在其他组件中使用，所以要在每个组件中定义自己的filter，这样就会出现很多重复的代码，那有没有办法定义一个公用的filter，减少代码的重复呢？下面就给大家展示下使用最多且有效的方法。
1.首先在公用js中定义一个通用的filter.js

const Filters = {
    stockCode(code){
        if(code){
            return code.substr(1,code.length-1);
        } else {
            return code;
        }
    }
}
export default Filters;

2.然后在main.js中引入

//引入过滤函数
import vueFilter from './sys/filters';

for (let key in vueFilter){
  Vue.filter(key,vueFilter[key])
}

3.这样我们就可以在组件中使用啦

<el-col :span="3"><div>{{item[0]|stockCode}}</div></el-col>

很赞哦！ (0)

上一篇：uniapp规范开发（5）注释规范

下一篇：uniapp规范开发（6）编码规范

数据库

开发终端

语言基础

项目管理

产品设计

系统

工作规范

计算机网络

前端技术栈

数据结构

计算机组成原理

后端技术栈

性能优化

安全设计

常见模块

计算机操作系统

服务器

python

MySQL

thinkphp

PHP

Java

JavaScript

Windows

Linux

特效

indexedDB

vue

淘宝联盟

Ionic

Angular

微信小程序

支付宝小程序

uni-app

css/sass/less

支付

socket

爬虫

web性能优化

消息推送

CVM

sqlite

Redis

前端基础

基础

element

Nginx

yii2

/ponder/index.php/index/catelist/catelist/cateid/10.html

标签云

站点信息

文章统计：528篇
移动端访问：扫码进入SQ3R

软件开发(47)	MySQL(25)
thinkphp(89)	PHP(33)
JavaScript(39)	项目管理(3)
产品设计(5)	Linux(15)
计算机网络(6)	计算机组成原理(1)
微信小程序(7)	安全设计(4)
uni-app(70)	淘宝联盟(4)
支付(7)	socket(18)
计算机操作系统(4)	爬虫(5)
web性能优化(5)	消息推送(9)
CVM(2)	Redis(27)
indexedDB(5)	vue(57)
特效(2)	css/sass/less(5)
基础(1)	element(1)
Nginx(6)	yii2(19)

您现在的位置是：网站首页>软件开发>开发终端>uni-appuni-app

uniapp规范开发（8）使用过滤器filter

相关阅读 (同一栏目)

栏目目录

标签云

站点信息

申请链接友情链接