美文网首页
Vue 计算属性

Vue 计算属性

作者: 寻找无名的特质 | 来源:发表于2022-10-06 06:01 被阅读0次

当某些属性与其它属性通过算法联动时,就可以将这些属性定义为计算属性,示例如下:

<body>
    计算属性
    <div id="app">
        <input v-model="a" />
        <div>
            {{b}}
        </div>
    </div>
    <script src="/lib/vue/vue.js"></script>
 
    <script>
        new Vue({
            el: '#app',
            data : {
               a:1
            },
            computed: {
                b() {
                    return this.a * 2;
                }
            }
        })
    </script>
</body>

如果遇到复杂的模板算法,可以考虑用计算属性进行替代。计算属性也可以调用计算属性,比如增加:
c() {
return this.b * 2;
}

并且定义的顺序没有关系。但是不能循环调用,否则会导致堆栈溢出。

相关文章

网友评论

      本文标题:Vue 计算属性

      本文链接:https://www.haomeiwen.com/subject/hqluartx.html