vue14 自定义过滤器
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>智能社——http://www.zhinengshe.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<style>
</style>
<script src="vue.js"></script>
<script>
</script>
</head>
<body>
<div id="box">
{{a | toDou}}
</div>
<script>
Vue.filter('toDou',function(input){
return input<10?'0'+input:''+input;
});
var vm=new Vue({
data:{
a:9
},
methods:{
}
}).$mount('#box');
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>智能社——http://www.zhinengshe.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<style>
</style>
<script src="vue.js"></script>
<script>
</script>
</head>
<body>
<div id="box">
{{a | toDou 1 2}}
</div>
<script>
Vue.filter('toDou',function(input,a,b){
alert(a+','+b);
return input<10?'0'+input:''+input;
});
var vm=new Vue({
data:{
a:9
},
methods:{
}
}).$mount('#box');
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>智能社——http://www.zhinengshe.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<style>
</style>
<script src="vue.js"></script>
<script>
</script>
</head>
<body>
<div id="box">
{{a | date}}
</div>
<script>
Vue.filter('date',function(input){
var oDate=new Date(input);
return oDate.getFullYear()+'-'+(oDate.getMonth()+1)+'-'+oDate.getDate()+' '+oDate.getHours()+':'+oDate.getMinutes()+':'+oDate.getSeconds();
});
var vm=new Vue({
data:{
a:Date.now()
},
methods:{
}
}).$mount('#box');
</script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>智能社——http://www.zhinengshe.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<style>
</style>
<script src="vue.js"></script>
<script>
</script>
</head>
<body>
<div id="box">
<input type="text" v-model="msg | fiterHtml">
<br>
<div v-html="msg"> </div>
</div>
<script>
//<h2>welcome</h2>
Vue.filter('fiterHtml',function(input){
return input.replace(/<[^<]+>/g,'');
});
var vm=new Vue({
data:{
msg:'<strong>welcome</strong>'
},
methods:{ }
}).$mount('#box'); </script>
</body>
</html>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>智能社——http://www.zhinengshe.com</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<style> </style>
<script src="vue.js"></script>
<script>
//<h2>welcome</h2>
Vue.filter('filterHtml',{
read:function(input){ //数据-视图页面
alert(1);
return input.replace(/<[^<]+>/g,'');
},
write:function(val){ //视图页面 -> 数据
console.log(val);
return val;
}
});
window.onload=function(){
var vm=new Vue({
data:{
msg:'<strong>welcome</strong>'
}
}).$mount('#box');
}; </script>
</head>
<body>
<div id="box">
<input type="text" v-model="msg | filterHtml">
<br>
{{{msg}}}
</div>
</body>
</html>
vue14 自定义过滤器的更多相关文章
- 实现MVC自定义过滤器，自定义Area过滤器，自定义Controller，Action甚至是ViewData过滤器
MVC开发中几种以AOP方式实现的Filters是非常好用的,默认情况下,我们通过App_Start中的FilterConfig来实现的过滤器注册是全局的,也就是整个应用程序都会使用的,针对单独的Fi ...
- lucene自定义过滤器
先介绍下查询与过滤的区别和联系,其实查询(各种Query)和过滤(各种Filter)之间非常相似,可以这样说只要用Query能完成的事,用过滤也都可以完成,它们之间可以相互转换,最大的区别就是使用过滤 ...
- asp.net MVC之 自定义过滤器(Filter) - shuaixf
一.系统过滤器使用说明 1.OutputCache过滤器 OutputCache过滤器用于缓存你查询结果,这样可以提高用户体验,也可以减少查询次数.它有以下属性: Duration :缓存的时间, 以 ...
- angular之自定义过滤器的使用
自定义过滤器需要使用filter函数,格式如下: filter("filterName',function(){ return function(target,args){ .... } } ...
- 第六节：Vue过滤器的用法和自定义过滤器
1.过滤器的用法,用 '|' 分割表达式和过滤器. 例如:{{ msg | filter}} {{msg | filter(a)}} a就标识filter的一个参数. 用两个过滤器:{{ ...
- .net中自定义过滤器对Response内容进行处理
原文:http://www.cnblogs.com/zgqys1980/archive/2008/09/02/1281895.html 代码DEMO:http://files.cnblogs.com/ ...
- asp.net MVC之 自定义过滤器(Filter)
一.系统过滤器使用说明 1.OutputCache过滤器 OutputCache过滤器用于缓存你查询结果,这样可以提高用户体验,也可以减少查询次数.它有以下属性: Duration:缓存的时间,以秒为 ...
- Vue自定义过滤器
gitHub地址: https://github.com/lily1010/vue_learn/tree/master/lesson05 一 自定义过滤器(注册在Vue全局) 注意事项: (1)全局方 ...
- 关于angularjs 中自定义过滤器
包子认为,在angularjs中,经常需要用到自定义过滤器,来过滤相应的功能,自定义过滤器非常的简单,我就直接贴代码啦 其中input就是你需要进行操作的对象,,,用法就直接就是 是不是很easy.. ...
随机推荐
- （六）Redux进阶
1 UI组件与容器组件的拆分 UI组件(傻瓜组件):只负责页面显示,没有任何逻辑 容器组件(聪明组件):并不去管UI到底长成什么样,关注的是整个业务逻辑 2 无状态组件 一个普通的函数就是无状态组件 ...
- UVA-1602 Lattice Animals 搜索问题（打表+set）
题目链接 https://vjudge.net/problem/UVA-1602 紫书的一道例题,跟之前的很多题目有很多不同. 本题不像是一般的dfs或bfs这样的搜索套路,而是另一种枚举思路. 题意 ...
- ajaxFileUpload 返回的数据报错
$.ajaxFileUpload({ url : '/updateMallGoods', data : { "goodsName":goodsName, "proDesc ...
- 【jQuery05】通过按键 来切换 class
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 题解 洛谷 P3376 【【模板】网络最大流】
本人很弱,只会Dinic.EK与Ford-Fulkerson...(正在学习ISAP...) 这里讲Dinic... Dinic:与Ford-Fulkerson和的思路相似(话说好像最大流求解都差不多 ...
- 2015 Multi-University Training Contest 3 hdu 5326 Work
Work Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others)Total Submis ...
- mysql索引的使用及优化方法
数据库高级管理及优化 MySQL性能优化 优化MySQL数据库是数据库管理员和数据库开发人员的必备技能.优化MySQL,一方面是找出系统的瓶颈,提高MySQL数据库整体的性能:另一方面是合理设计结构和 ...
- C# 获取本地电脑所有的盘符
话不多说,直接上菜: public List<string> GetRemovableDeviceID() { List<string> deviceIDs = new ...
- Ruby创建命令
Ruby创建命令
- iOS9适配小结
前言 最新公布的app版本号适配了iOS9.总结一下适配过程的几个要点. Bitcode iOS9此番推出了新的特性:Bitcode,关于Bitcode的资料大家能够在网上找.Bitcode要求pro ...