vue global filters

//main.js

import * as filters from ‘./filters‘
// console.log(filters);
Object.keys(filters).forEach(key => {
  Vue.filter(key, filters[key])
})

//filters.js

export function gender(val) {
    return ["未知", "男", "女"][val];
}

export function boolText(val) {
    return ["否", "是"][val];
}
export function strTrim(val, len, start = 0) {
    if (!val) {
        return ‘‘;
    }
    return val.slice(start, len)
}
export function statusText(val) {
    return ["禁用", "启用"][val];
}

原文地址:https://www.cnblogs.com/fenle/p/11392856.html

时间: 2024-08-01 12:20:00

vue global filters的相关文章

vue中filters(过滤器)的使用

在vue中使用filters Vue.js自定义过滤器,可被用于一些常见的文本格式化.过滤器可以用在两个地方:双花括号插值和 v-bind 表达式.过滤器应该被添加在 JavaScript 表达式的尾部,由"管道"符号指示: <!-- 在双花括号中 --> <!-- message作为capitalize的第一个参数 --> {{ message | capitalize }} <!-- 如果有多个参数,message作为第一个参数,其它参数写在capit

Goodsync的Global Filters以及保存办法

程序项目编译的中间文件通常不用备份,可以在GoodSync的Tools菜单/Program Options选项页面设置Filters过滤掉: 通常这个列表会很长,遗憾的是没有一个导入导出的功能.办法是有的,找到Goodsync的配置文件备份一下.在我的win7 64位系统里找到: c:\Users\<用户名>\AppData\Roaming\GoodSync\options.tic 有点让人头痛的是options.tic里所有配置都写成一行,红色部分是Exclude部分: [F[i[L<

vue的filters时间过滤器

filters: { formatTime: function(value) { let time = new Date(value * 1000); let year = time.getFullYear(); let month = time.getMonth() + 1; if (month < 10) { month = "0" + month; } let day = time.getDate() < 10 ? "0" + time.getDa

vue 的 main.js 设置

import Vue from 'vue' // import App from './App.vue' import router from './router' import store from './store' import axios from 'axios' //添加自定义的全局方法 import globalFunc from "./utils/globalFunc" Vue.use(globalFunc) import ElementUI from 'element-

用脚手架简单搭建vue开发环境

完成后目录展示: component文件里放的是页面,parts放的是入口文件main.js需要引入的js依赖. 事先安装cnpm.然后用脚手架工具 vue-cli 来创建一个使用 vue-loader 的项目: cnpm install -g vue-cli vue init webpack-simple myvue cd myvue cnpm install 接下来安装vue-router和vuex cnpm install vue-router vuex --save-dev 打开main

vue and jest测试

测试Vue的filters方法: 局部: import Page from '../src/Page' it('filter', () => { const case = Page.filters.toLowerCase('HI') expect(case).toBe('hi') }) 全局: Vue.options.filters.toLowerCase('HI').toBe('hi')在其他测试页面中只需引入filter即可eg: import {toLowerCase} from 'fil

Vue.js 实践(2):实现多条件筛选、搜索、排序及分页的表格功能

与上周的第一篇实践教程一样,在这篇文章中,我将继续从一种常见的功能--表格入手,展示Vue.js中的一些优雅特性.同时也将对filter功能与computed属性进行对比,说明各自的适用场景,也为vue2.0版本中即将删除的部分filter功能做准备. 需求分析 还是先从需求入手,想想实现这样一个功能需要注意什么.大致流程如何.有哪些应用场景. 表格本身是一种非常常用的组件,用于展示一些复杂的数据时表现很好. 当数据比较多时,我们需要提供一些筛选条件,让用户更快列出他们关注的数据. 除了预设的一

vue-router+vuex实现加载动态路由和菜单

前言 动态路由加载和动态菜单渲染的应用在后端权限控制中十分常见,后端只要加载权限路由进行渲染返回到浏览器就可以.在前后端分离中,权限控制动态路由和动态菜单也是一个非常常见的问题.其实我们最最理想的效果是什么呢?我们访问一个应用,在登录之前有哪些路由是一定要加载的呢?你看我总结如下,你看下是不是这些: 1.登录路由 (登录功能路由) 2.系统路由(系统消息路由,比如欢迎界面,404,error等的路由) 但是在vue中,一旦实例化,就必须初始化路由,但这个时候你还没有登录,没有获取你的权限路由呀,

MVC使用HandleErrorAttribute自定义异常

MVC中,有一个Filter可以捕捉错误,但是它的用法是利用Attribute来实现的,而且只能加在Controller和Action上,所以不能捕捉别出的错误 其实理论上所有的错误肯定产生于Controller中,但有2种情况下,就不会被捕捉了 1.页面不存在的时候,找不到对应的Controller,那没有任何Controller被执行,所以自然也不会捕捉到错误了 2.在 IAuthorizationFilter 下发生错误的时候,错误捕捉代码在IExceptionFilter中,而IAuth