vue filters过滤
<template>
<div class="filters">
<h1 v-text="filtersTitle"></h1>
<input v-model="filtersText"/>
<div>{{filtersText | filtersTextChange}}</div>
</div>
</template>
<script>
let vm = {};
export default {
data() {
vm = this;
return {
filtersTitle: 'vue过滤器学习,filters',
arrayList: [
{
"code": "1",
"value": "北京市"
},
{
"code": "2",
"value": "上海市"
},
{
"code": "3",
"value": "广州市"
},
{
"code": "4",
"value": "深圳市"
},
{
"code": "5",
"value": "杭州市"
},
{
"code": "6",
"value": "天津市"
},
{
"code": "7",
"value": "西安市"
},
{
"code": "8",
"value": "武汉市"
},
{
"code": "9",
"value": "长沙市"
}
],
filtersText: '1',
}
},
filters: {
filtersTextChange: function (dataStr) {
let arrayList = vm.arrayList;
let value = '没有这个城市 ';
for (let b of arrayList) {
if (b.code == dataStr) {
value = b.value;
break;
}
}
return value;
}
}
}
</script>

全局过滤器

vue filters过滤的更多相关文章
- vue filters 日期
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- vue filters中使用data中数据
vue filters中 this指向的不是vue实例,但想要获取vue实例中data中的数据,可以采用下面方法.在 beforeCreate中将vue实例赋值给全局变量app0,然后filters中 ...
- vue filters 时间戳转化成时间格式
vue filters 时间戳转化成时间格式 filters: { formatDate: function (time) { var re = /-?\d+/ var m = re.exec(tim ...
- vue filters过滤器
vue filters过滤器 vue.js允许我们自定义过滤器,可被使用于一些常见的文本格式化,过滤器可以用在两个地方,双花括号插值和 v-bind表达式.最常见的就是双花括号插值. 比如如下代码:{ ...
- Vue.js示例:GitHub提交(watch数据,created钩子,filters过滤); 网格组件(功能:1.检索,2排序);
GitHub提交 codePen: https://codepen.io/chentianwei411/pen/wEVPZo 注意:频繁看案例,可能会被限制. 重点: 表单输入绑定, 单选按钮的使 ...
- Vue 全局过滤和局部过滤
局部过滤器(放在组件里) filters: { //局部过滤器 FormattingMoney:value=>{ return value==null? '0' : value/100 } }, ...
- vue 时间过滤
1.过滤13位时间戳(以评论时间为例) filters : { formattime2: function (value) { //value为13位的时间戳 var timestamp = Date ...
- VueJS自定义过滤器:new Vue({filters:{filter1:function(){}....}})
Vue.js 允许你自定义过滤器,被用作一些常见的文本格式化. 语法 <!-- 在两个大括号中 --> {{ message | capitalize }} <!-- 在 v-bin ...
- Vue -- filters 过滤器、倒计时效果
局部过滤器 时间.***号 <div id="wrapper" class="wrapper" style="display: none;&qu ...
随机推荐
- 序列式容器————vector
目录 介绍 1 创建 2 容量和大小 size() capacity() 3 resize() 4 reverse() 5 获取元素 front() back() 6 迭代器(待补充) 7 push_ ...
- java开发需掌握技能1
1.熟练掌握Java基础.语法规范.集合框架等,基础语法.Java关键字.内部类.泛型.集合类使用场景2.Java io/nio框架体系.文本文件.二进制文件读写.nio.buffer机制3.Jsp. ...
- 【转】毛虫算法——尺取法
转自http://www.myexception.cn/program/1839999.html 妹子满分~~~~ 毛毛虫算法--尺取法 有这么一类问题,需要在给的一组数据中找到不大于某一个上限的&q ...
- 解决vuex保存的数据刷新页面时清空
参考文章: vuex中store保存的数据,刷新页面会清空 主要解决代码: 1.更改store文件下index文件state的定义 const store = new Vuex.Store({ sta ...
- spring security跳过认证
在启动springboot的时候,给启动注解后添加这个exclude参数后接想要跳过的类就不会加载它了. @SpringBootApplication(exclude = { org.springfr ...
- 测开之路一百三十三:实现sql函数封装
连接数据库的频率很高,所以把数据库操作封装起来 函数封装: def make_dicts(cursor, row): """ 将游标获取的Tuple根据数据库列表转换为d ...
- sql 、linq、lambda 查询语句
http://www.cnblogs.com/lei2007/archive/2011/07/21/2113161.html
- oracle ogg 单实例单向简单搭建测试(oracle-oracle)
昨天突然接到消息说有一个线上的ogg出现了问题,看是否能修复,由于ogg以前玩的少,所以就加急搞了个测试环境,练习了一把 环境 db1,db2(单实例)ip: 1*,1*sid: orcl,ogg1o ...
- [ScreenOS] How to change the certificate that is used for SSL (HTTPS) WebUI Management
SUMMARY: This article provides information on how to change the certificate that is used for SSL (HT ...
- C#银行卡号每隔4位数字加一个空格
1.填写银行卡号每隔4位数字加一个空格 Regex.Replace(dic["BankCardNo"].ToString(), @"(\d{4}(?!$))", ...