使用vue计算属性获取和设置的示例

本文说明了获取和设置vue计算属性的用法。分享给大家参考，如下：

计算属性是什么：vue文档中说模板中绑定了太多的逻辑，使得模板太重，难以维护。

换句话说，您可以设置自己的值(B值)，它与数据(A值)下定义的值有某种关系。B的值是基于A的值，一些逻辑生成的值可以直接在模板中使用。当a的值改变时，b的值也改变。是计算默认值get in属性。那到底设置了什么？

b的值是基于a的变化而变化的，那么b的值被直接修改会怎么样呢？这将进入set方法。

一般规律：B的值总是取决于A的值的存在和变化，最终渲染的A为100，B为110

！doctype html lang=' en ' head metaharset=' utf-8 ' title vue计算属性get和set/title style/style script src=' http:https://cdn.bootcss.com/vue/2.4.4/vue . min . js '/script/head body div id=' app ' pa的值为：{{a}}/p pb为：{ { b } }/p button @ click=' change ' button/div script new vue({ El : ' # app '，data:{ a:1 }，computedb=100 } } })/script/body/HTML在这里，使用在线HTML/CSS/JavaScript代码运行工具：http://tools.jb51.net/code/HtmlJsRun对上述代码进行测试，可以得到如下运行结果：

希望本文对vue.js程序的设计有所帮助。