vue-filters(过滤器)
局部过滤器:
<html> <head>
<title>vue</title>
<meta charset="utf-8">
</head> <body>
<div id="app">
{{msg | toFixed(1)}}
<!-- msg是参数input的值,方法里的参数都是作为input后的参数 -->
</div>
</body>
<script src="node_modules\vue\dist\vue.js"></script>
<script>
let vm = new Vue({
el: "#app",
filters: {
// toFixed(input,param1,param2,param3)
toFixed(input, num) { //第二个参数为小数点个数
return '¥' + input.toFixed(num);
}
},
data:{
msg:15.123
}
});
</script> </html>

全局过滤器(记得放在所有实例之前)
<html> <head>
<title>vue</title>
<meta charset="utf-8">
</head> <body>
<div id="app">
{{msg | my(2)}}
<!-- msg是参数input的值,方法里的参数都是作为input后的参数 -->
</div>
</body>
<script src="node_modules\vue\dist\vue.js"></script>
<script>
// 全局过滤
// Vue.filter(name,function)
Vue.filter('my',(input,num)=>{
return '¥' + input.toFixed(num);
})
// 局部过滤
let vm = new Vue({
el: "#app",
filters: {
// toFixed(input,param1,param2,param3)
toFixed(input, num) { //第二个参数为小数点个数
return '¥' + input.toFixed(num);
}
},
data:{
msg:15.123
}
});
</script> </html>

vue-filters(过滤器)的更多相关文章
- vue filters过滤器
vue filters过滤器 vue.js允许我们自定义过滤器,可被使用于一些常见的文本格式化,过滤器可以用在两个地方,双花括号插值和 v-bind表达式.最常见的就是双花括号插值. 比如如下代码:{ ...
- Vue -- filters 过滤器、倒计时效果
局部过滤器 时间.***号 <div id="wrapper" class="wrapper" style="display: none;&qu ...
- vue filters过滤器的使用
说的很详细 https://www.w3cplus.com/vue/how-to-create-filters-in-vuejs.html
- 六、vue基础--过滤器定义
七.过滤器定义 1.使用:{{username|strip}}.<a :href="url|strip">百度</a> 2.定义:都是定义一个函数,这个函数 ...
- Vue.js Cookbook: 添加实例属性; 👍 axios(4万➕✨)访问API; filters过滤器;
add instance properties //加上$,防止和已经定义的data,method, computed的名字重复,导致被覆写.//可以自定义添加其他符号. Vue.prototype. ...
- Vue学习之--------Vue中过滤器(filters)的使用(代码实现)(2022/7/18)
1.过滤器 1.1 概念 过滤器: 定义:对要显示的数据进行特定格式化后再显示(适用于一些简单逻辑的处理). 语法: 1.注册过滤器:Vue.filter(name,callback) 或 new V ...
- Vue自定义过滤器
gitHub地址: https://github.com/lily1010/vue_learn/tree/master/lesson05 一 自定义过滤器(注册在Vue全局) 注意事项: (1)全局方 ...
- vue filter过滤器简单应用
vue中过滤器,用于一些常见的文本格式化,用 | 来操作. 过滤器可以用在两个地方: 1.在{{}}双花括号中插入值 2.v-bind表达式中使用 <!-- 在双花括号中 --> {{ m ...
- vue的过滤器
Vue.Js 提供了强大的过滤器API,能够对数据进行各种过滤处理,返回需要的结果 vue的过滤器一般在JavaScript 表达式的尾部,由“|”符号指示: 过滤器可以让我们的代码更加优美,一般可以 ...
- vue自定义过滤器的创建和使用
1.简单介绍 过滤器的作用:实现数据的筛选.过滤.格式化. 过滤器的本质是一个有参数,有返回值的方法. 过滤器可以用在两个地方:双花括号插值和v-bind表达式(后者从2.1.0+开始支持 ...
随机推荐
- CSS如何实现把鼠标放在行上整行变色
CSS如何实现把鼠标放在行上整行变色: 在很多网站都有这样的效果,那就是当鼠标放在一个文章列表行的时候,此行就会显示与其他行不同的颜色,本站的文章列表也具有这样的效果,便于浏览者识别,非常人性化,下面 ...
- 阶段5 3.微服务项目【学成在线】_day17 用户认证 Zuul_05-用户认证-认证服务查询数据库-调用查询用户接口
用户认证服务调用根据账号查询用户的信息 怎么远程调用呢?要创建一个客户端,这个客户端其实就是一个接口 标明服务的名称是ucenter服务 这是ucenter服务里面 复制过来接口的定义,GetMapp ...
- Python2和Python3的字符串编码和类型
一.字符串编码和类型 任何编码格式的字符串,都可以和Unicode互相转换. gbk -> utf8 # 将字符串按指定格式进行解码,返回Unicode字符串unicode_str = gbk_ ...
- 使用Tomcat搭建基于域名的虚拟机
Tomcat搭建基于域名的虚拟主机,实际就是实现了同一个Tomcat部署多个项目(网站/应用程序).端口可以使用同一个,也可以不同. (1).在tomcat的conf文件夹下存在Tomcat的配置文件 ...
- PPT做交互效果
1 做交互效果(点击一个按钮,弹出某个框或者跳转到某个页面)其实就是若干个PPT页面,利用给按钮增加超链接或者动作 达到点击一个按钮 跳转到另外一个PPT的效果. 2 选择一个形状组件(或者其他组件) ...
- Python3之使用枚举类
当我们需要定义常量时,一个方法是用大写变量通过整数来定义,例如月份 JAN = 1 FEB = 2 MAR = 3 APR=4 May=5 Jun=6 Jul=7 Aug=8 Sep=9 Oct=10 ...
- iOS-类似微信摇一摇
首先,一直以为摇一摇的功能实现好高大上,结果百度了.我自己也模仿写了一个demo.主要代码如下: 新建一个项目,名字为AnimationShake. 主要代码: - (void)motionBegan ...
- [转帖]最佳 Linux 发行版汇总
最佳 Linux 发行版汇总 https://cloud.tencent.com/developer/article/1505186 以后说不定用的到. Linux入门 Ubuntu Ubuntu是一 ...
- [转帖]当 K8s 集群达到万级规模,阿里巴巴如何解决系统各组件性能问题?
改天学习一下. https://www.cnblogs.com/alisystemsoftware/p/11570806.html 当 K8s 集群达到万级规模,阿里巴巴如何解决系统各组件性能问题 ...
- oracle 列合并成并用拼接符拼接 -- LISTAGG函数用法
==注:wm_concat(str1) 11g 后不支持使用== LISTAGG函数用法 select LISTAGG(name, ',') WITHIN GROUP (ORDER BY id) fr ...