代码:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script type="text/javascript" src='js/bower_components/vue/dist/vue.js'></script> </head> <body> <script type="text/javascript"> var a=new Vue( { el:'body', data:{ a:10, b:20 }, computed:{ c: { get:function() { return this.w; }, set:function(v) { this.w=v+this.a; } } } } ); a.c=666; console.log(a.c); </script> </body> </html>
解释:
a代表
c代表
结果为什么是这样子的676?
因为a.c=666;其中666赋值给了v,然后在set里面计算,然后再get里面读取输出
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <script type="text/javascript" src='js/bower_components/vue/dist/vue.js'></script> </head> <body> <script type="text/javascript"> var a=new Vue( { el:'body', data:{ a:10, b:20 }, computed:{ c: { get:function() { return 666; }, set:function(v) { this.w=v+this.a; } } } } ); console.log(a.c); </script> </body> </html>解释:
因为没有赋值给v那里,所以set里面用不上,
所以直接读取,然后直接输出666
效果: