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 ...
随机推荐
- 一款基于jQuery的分页插件
特别提示:本人博客部分有参考网络其他博客,但均是本人亲手编写过并验证通过.如发现博客有错误,请及时提出以免误导其他人,谢谢!欢迎转载,但记得标明文章出处:http://www.cnblogs.com/ ...
- leetcode-mid-backtracking -78 Subsets
mycode 86.06% class Solution(object): def subsets(self, nums): """ :type nums: List ...
- Python locals() 的陷阱
转载自https://segmentfault.com/a/1190000012724861 在工作中, 有时候会遇到一种情况: 动态地进行变量赋值, 不管是局部变量还是全局变量, 在我们绞尽脑汁的时 ...
- spring +spring+ hibernate配置1
这种配置方式是将Spring .SpringMVC.Hibernate三个模块分开配置,交叉引用!hibernate连接配置使用.properties文件 web.xml配置 <web-app ...
- python学习之文件读写操作
open函数 在使用文件之前,需要先打开,即使用open函数 如: files=open("文件路径","操作方式") 解释如下: (1.files:为文件对象 ...
- Java与C#不同
1.C#方法定义可以有默认参数,而Java则不支持该方式. C#方法定义 public void ShowMessage(string text,string orderId="" ...
- MySQL学习-入门语句以及增删查改
1. SQL入门语句 SQL,指结构化查询语言,全称是 Structured Query Language,是一种 ANSI(American National Standards Institute ...
- 利用yum创建本地仓库与网络源
一.创建本地yum仓库 1.cd /etc/yum.repos.d/ 2.创建配置文件:[root@li yum.repos.d]# vim local.repo 3.写入配置信息并保存 [li]na ...
- Slience is the sleep that nourishes wisdom
cumulative: 积聚的 lag. v. 落后 backfire. n. 事与愿违 segregated. adj. 分隔的 back-and-forth: 来回地 initiative. ad ...
- 各种开源许可 license 区别
copy from http://www.ruanyifeng.com/blog/2011/05/how_to_choose_free_software_licenses.html