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. 其他 - 阻塞 & 同步 的基本认识

    1. 概述 有些概念, 老是弄不清楚 同步异步 阻塞非阻塞 2. 准备 场景 角色 client 发起请求 接受请求 server 接受请求 执行操作 返回响应 行为 大致是一个 C/S 模式的模型 ...

  2. Python turtle库详解

    Python turtle库详解 Turtle库是Python语言中一个很流行的绘制图像的函数库,想象一个小乌龟,在一个横轴为x.纵轴为y的坐标系原点,(0,0)位置开始,它根据一组函数指令的控制,在 ...

  3. SOCV/POCV 开篇 (1)

    1.功能:模拟工艺偏差对芯片性能的影响 2. 40nm之前 flat derate模型可以基本覆盖大部分情况 3.AOCV (Adance OCV) 考虑distance 和depth的影响. AOC ...

  4. Nginx做代理

    0 查看日志 tail -f /var/log/nginx/access.log 1 Nginx代理配置语法 1.Nginx代理配置语法 Syntax: proxy_pass URL; Default ...

  5. Arctic Network(洛谷)--北极通讯网络(loj)

    洛谷传送门 loj传送门 一道蛮基础的最小生成树的题 题意也没绕什么圈子 只是叙述的有点累赘而已(loj上是这样的 也就读入加建边需要稍稍稍多想一下下 对于我这么一个蒟蒻 这是一道很好的板子题 (洛谷 ...

  6. 验证码比较hash_equals 方法

    验证码是否与缓存中一致时,使用了 hash_equals 方法: hash_equals($verifyData['code'], $request->verification_code) ha ...

  7. Plastic Bottle Manufacturer Profile: Plastic Bottle Forming Process

    Plastic bottle molding refers to the process of making a final plastic product from a polymer produc ...

  8. lca最近公共祖先与树上倍增。

    https://vjudge.net/contest/295298#problem/A lca 的题目 求任意两点的距离. A题是在线算法,用st表rmq来实现. https://blog.csdn. ...

  9. php-cp(php连接池)扩展的安装

    今天看到php有连接池的扩展,不管效果怎么样,都值得一试,这样才会有突破. 先从guthub上搜索源码:[ https://github.com/swoole/php-cp ] 通过命令clone到自 ...

  10. Catalyst 6500/6000 Switches ARP or CAM Table

    译:https://www.cisco.com/c/en/us/support/docs/switches/catalyst-6500-series-switches/71079-arp-cam-ta ...