vue14 自定义过滤器
2024-05-18 03:14:23
<!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 自定义过滤器相关推荐
- 【AngularJS】—— 9 自定义过滤器
AngularJS另一个特点就是提供了过滤器,可以通过操作UNIX下管道的方式,操作数据结果. 通过使用管道,可以便于双向的数据绑定中视图的展现. 过滤器在处理过程中,将数据变成新的格式,而且可以使用 ...
- springboot过滤字段_SpringBoot自定义过滤器的两种方式及过滤器执行顺序
第一种 @WebFilter + @ServletComponentScan 注解 1.首先自定义过滤器 如下自定义过滤器 ReqResFilter必须实现 javax.servlet.Filter ...
- Django 框架13: 自定义过滤器和标签
2019独角兽企业重金招聘Python工程师标准>>> Django的模板系统自带了一系列的内建标签和过滤器,一般情况下可以满足开发要求,如果觉得需更精准的模板标签或者过滤器,可以自 ...
- 2.选择元素 - 自定义过滤器《jquery实战》
2.5.6 自定义过滤器 jQuery 中有两种方法创建自定义的过滤器.第一种比较简单,但是不鼓励,从 jQuery 1.8 开始已经被第二种方法取代.记住,使用新方法时,你自定义的过滤器在 jQue ...
- dubbo 自定义过滤器，打印接口调用信息
dubbo提供了web filter类似的com.alibaba.dubbo.rpc.Filter,这样,我们可以在dubbo提供的服务提供方和消费方都可以自定义过滤 器,从而可以获得方法调用的时间或 ...
- Flask 自定义过滤器多个参数传入
非完整HTML文件: <div class="container" style="margin-top:50px;"><div class=& ...
- 过滤器获取service方法返回慢_Gateway：自定义过滤器
自定义局部过滤器 需求:在application.yml中对某个路由配置过滤器,该过滤器可以在控制台输出配置文件中指定名称的请求参数的值. 在gateway-server模块中编写过滤器工厂类MyPa ...
- flask第二十四篇——模板【6】自定义过滤器
请关注孟船长的公众号:自动化测试实战 大家想了解其他过滤器可以参考这里: http://jinja.pocoo.org/docs/dev/templates/#builtin-filters ---- ...
- django自定义过滤器及模板标签
django自定义过滤器及模板标签 文件路径配置: 某个app特有的 -app 目录下,新建templatetags 文件夹 -再到 templatetags 文件夹下创建python模块(py文件) ...
最新文章
- 11.14 模拟：总结
- x210烧写流程(inand)
- 合并两个有序数组 java_合并两个有序的数组
- java 内部类 单例_确保对象的唯一性——单例模式 （四）：一种更好的单例实现方法（静态内部类）...
- 项目交换成功——PM（李忠）
- 去蓝港在线面试Unity3D的笔试题。难吗？知道答案的在评论里写出来分享
- Matlab plot默认常用颜色RGB及十六进制颜色代码
- JVM基础知识1---尚硅谷视频笔记整理
- 使用NanoHttpd实现简易WebServer
- 理解 Serenity，Part-1：深度抽象
- Typora也能做思维导图？做笔记的又一个绝佳选择？
- 计算机网络设备网关属于固定资产,财政六大类常用固定资产分类及代码
- linux 微信不能发图片,微信回应发原图泄露位置信息；元旦起 AI 造假音视频不得随意发布...
- IEEE754浮点数算数标准
- 音乐翻唱软件测试初学者,音乐APP听歌识曲大评测，QQ音乐独家“翻唱识别”领跑...
- WiFi工作原理简述
- 图灵奖得主Geoffrey Hinton：我的五十年深度学习生涯与研究心法
- ECS的简单入门（一）：概念
- XTW100高速编程器驱动安装
- python处理xml文件_实例Python处理XML文件的方法