计算属性的get和set方法

佚名 6年前 (2019-05-10) 随笔 834人围观抢沙发百度已收录

canrun

计算属性由get和set两部分组成，分别用来获取计算属性和设置计算属性。默认只有get没有set，需要自己添加。

SRE实战互联网时代守护先锋，助力企业售后服务体系运筹帷幄！一键直达领取阿里云限量特价优惠。

 1 <div id="app">
 2          <input type="text" v-model="inputvalue"><button @click="tijiao">点击提交</button>
 3          {{fullName}}
 4      </div>
 5      
 6 <script src="https://blog-static.cnblogs.com/files/ss-wdp/vue.js"></script>
 7      <script>
 8          var Vm=new Vue({
 9              el:"#app",
10              data:{
11                  firstName:'Hello',
12                  lastName:'World',
13                  inputvalue:'',
14              },
15              methods:{
16                tijiao:function () {
17                   this.fullName=this.inputvalue;
18                }
19             },
20              computed:{
21                  fullName:{
22                      get:function () {
23                          return this.firstName+"-"+this.lastName;
24                      },
25                      set:function (value) {
26                          var arr=value.split("-");
27                          this.firstName=arr[0];
28                          this.lastName=arr[1];
29                      }
30                  }
31              }
32          })
33      </script>