(二)computed计算选项
2018-02-15 本文已影响0人
我拥抱着我的未来
本节知识点
- 使用computed
概述
- computed的作用就是对原数据进行改造输出，改造输出包括:格式的输出，大小写转换，顺序重排，添加符号等。
(一) 格式化输出
- 原始数据就是price:100但是我们给用户输出的变成 ($100)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0,maximum-scale=1.0">
<title>Title</title>
<script src="js/vue.js"></script>
</head>
<body>
<div id="app">
<hello :info="message2"></hello>
</div>
</body>
<script>
Vue.component("hello",{
template:"<p style='color:red'>{{info}}</p>",
props:['info']
})
var app = new Vue({
el:"#app",
data:{
message:"100"
},
computed:{
message2:function(){
return "$"+this.message
}
}
})
</script>
</html>
