计算属性

在模板中当一个属性的值依赖另一个属性时,采用计算属性。

<html>

<head>
<script src='js/vue.js'></script>
</head>
<body>
<div id="example">
<input type='text' v-model='basePrice'/>
<button v-on:click="show">显示否</button><br>
<span v-if='flag'> {{ words }}</span>
</div>
</body>

<script type='text/javascript'>
new Vue({
el: '#example',
data: {
flag: true,
basePrice: 21
},
methods: {
show: function() {
this.flag = !this.flag;
}
},
computed: {
words: function() {
return this.basePrice + 1;
}
}

});
</script>
</html>

猜你喜欢

转载自blog.csdn.net/qq_23143555/article/details/80724168