使用vue计算属性计算的示例

本文通过一个例子来说明如何使用vue的计算属性。分享给大家参考，如下：

Computed : { b : function(){//默认情况下调用get返回值} } Computed : { b : { get 3360 set 3360 } } *有些业务逻辑代码可以放在Computed中，所以一定要记住return。

！doctype html lang=' en ' head meta charset=' utf-8 ' titlewww.jb51.net Vue计算属性calculated/title style/style script src=' http:https://cdn.bootcss.com/Vue/1 . 0 . 4/Vue . min . js '/script/head dy div id=' box ' a={ { a } } br b={ { b } }/div script var VM=new Vue({ El : ' # box '，data:{ a:1 }，Computed: { b: {//调用get}默认情况下，set:function (val) {this。a=val} } } });document . onclick=function(){ VM . b=10；//相当于set函数传入的val=10/脚本/正文/html运行结果：

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具：http://tools.jb51.net/code/HtmlJsRun来测试上述代码的运行效果。

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