filters
格式化变量输出内容(日期格式化、大小写转换、数字再计算)
类似Linux |
ls | grep 'dev*' #显示dev开头的文件
代码源文件
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<title>hellovue</title>
</head>
<body>
<div id="myApp">
<p>{{message}}</p>
<!--
{{message|toupper}}
可以理解为Linux管道
ls | grep 'dev*'
-->
<p>{{message|toupper}}</p>
<hr>
<p>现在的vue.js学习进度是{{num}}({{num | topercentage}})</p>
</div>
<script>
var myApp = new Vue({
/*绑定标签的id*/
el: '#myApp',
/*标签上绑定的数据*/
data: {
message: 'hello vue.js world',
num: 0.3
},
filters: {
/*全部转换为大写*/
toupper: function (value) {
return value.toUpperCase()
},
/*转换百分比*/
topercentage: function (value) {
return value * 100 + '%'
},
},
})
</script>
</body>
</html>
