1.src目录下创建filter文件

/**
* 男女
* @param val
* @returns {string}
*/
const status = val => {
let name = ''
let newVal = parseInt(val)
switch (newVal) {
case : name = '男'; break
case : name = '女'; break
default : name = '-'
}
return name
} export default {
status
}

2.在全局min.js下引入filter

import Filters from './filter/filter' // 自定义过滤器

Object.keys(Filters).forEach(key => Vue.filter(key, Filters[key])) // 自定义过滤器

3.在组件中使用

<template>
<el-row :gutter="" class="box">
<div>{{num1 | status}}</div>
</el-row>
</template> <script>
export default {
name: 'BigScreen',
data() {
return {
num1:
}
}
}
</script>

vue注册全局过滤器的更多相关文章

  1. 黑马vue---28、vue中全局过滤器的基本使用

    黑马vue---28.vue中全局过滤器的基本使用 一.总结 一句话总结: vue中的过滤器可以传递参数(根据参数来过滤),也可以用管道符拼接多个过滤器:例如<p>{{ msg | msg ...

  2. Vue中全局过滤器期与局部过滤器期的使用

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. vue 注册全局组件

    注册全局组件有啥好处呢? 提高代码的复用性:哪里需要写哪里,贼方便,就写一个标签:减少代码量:可以再配合slot一起使用,咦~~,舒服 为了让整个项目的可读性,我创建一个文件统一存放全局组件 1.创建 ...

  4. 优雅的处理vue注册全局组件

    使用情景: 有频繁使用的组件 需要进行全局注册 可以将这些组件都放在components下同一个文件夹下,在此文件夹中建立 一个js文件 代码如下: import Vue from 'vue'; // ...

  5. 第二章 Vue快速入门-- 24 过滤器-Vue中全局过滤器的基本使用

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8&quo ...

  6. VUE注册全局组件和局部组件

    全局组件 第一步:在components文件夹下建立一个子文件Users.vue <template> <div class="users"> {{msg} ...

  7. Vue定义全局过滤器filter

    这里介绍的是多个过滤器一起添加到全局中 1.创建方法 首先src下新建plugin文件夹,用来存放插件. 在plugin文件夹内新建filters.js,编写方法(如隐藏手机号码等等...) /** ...

  8. vue注册全局组件

    在项目开发中能不能自己写一个组件可以像iview或者element那样可以不必引用就可以直接用呢?答案是可以的. 首先,写一个组件mainHeader. 接着在vue中注册这个组件,代码如下: Vue ...

  9. vue注册全局属性

    例:统一引用getSpiderToken方法 main.js中相关代码 import { getSpiderToken } from '../static/js/storage' Vue.protot ...

随机推荐

  1. SpringMvc中文件的上传

    本文转自:http://www.cnblogs.com/fjsnail/p/3491033.html 三个方法没有都测试,先get再说 第一个方法慢不知道是不是因为写的代码是按字节读取的,没有用Buf ...

  2. 【资源分享】半条命2速通AHK脚本

    *----------------------------------------------[下载区]----------------------------------------------* ...

  3. 读写json文件

    def read_json(path): """return dict""" with open(path,'r+')as f: retur ...

  4. Redis安装及局域网访问配置CentOS

    1.安装gcc,用来编译reids 通过命令 sudo yum install gcc 2.安装redis $ wget http://download.redis.io/releases/redis ...

  5. Django - 后台admin不显示带auto_now, auto_now_add选项的字段

    https://stackoverflow.com/questions/6386172/datetimefield-doesnt-show-in-admin-system 解决办法 class Rat ...

  6. JS高级---构造函数通过原型添加方法,原型的作用: 共享数据, 节省内存空间

    JS高级---构造函数,通过原型添加方法,原型的作用: 共享数据, 节省内存空间 构造函数 //构造函数 function Person(sex, age) { this.sex = sex; thi ...

  7. spring 基于XML的申明式AspectJ通知的执行顺序

    spring 基于XML的申明式AspectJ通知的执行顺序 关于各种通知的执行顺序,结论:与配置文件中的申明顺序有关 1. XML文件配置说明 图片来源:<Java EE企业级应用开发教程&g ...

  8. css 把图片变成灰色

    3.14号刚下班,噩耗传来,伟大的物理学家斯蒂芬·威廉·霍金去世了. 同事正好叫我吃饭,几分钟内去看了一眼百度百科,一看也都变黑白了,可是查看图片还是彩色的,也是哪有这么快的时间来p图呢,回来搜了一下 ...

  9. watch监听变化

    <template> <div> 父级 <childCom1 @click.native="fn()"></childCom1> { ...

  10. mysql 多次分组查询 数据最大的一行

    SELECT B, D, Max(E)FROM `总表`WHERE B = '张士建'GROUP BY B, D 通过查询创建工具 编写查询语句