Go directly to the code: <div id="app"> <span>{{fullName}}</span> </div> <script> var vm = new Vue({ el: '#app', data: { firstName:'Dell', lastName: 'Lee' }, computed: { fullName:{ get: function () { return this.firstName + " " + this.lastName; }, set: function (value) { var arr = value.split(" "); this.firstName = arr[0]; this.lastName = arr[1]; } } } }) </script>
1. get is used to obtain the attribute value. Simultaneous computation generates new values.
2. set: used to change the value coming from the hull. When the change occurs, the content of the data also changes.