Vue. js computing attribute computed

Get attribute of Vue. js computing attribute computed

Html:

  
  
   {{fullName}} 
 

Js:

《script》export default { components: {  }, ready: function() {  }, methods: { }, data() { return { firstName: 'Foo', lastName: 'Bar' } }, computed: { fullName: { // getter get: function() { return this.firstName + ' and ' + this.lastName }, // setter set: function(newValue) { var names = newValue.split(' and ') this.firstName = names[0] this.lastName = names[names.length - 1] } } }}《script》

The get and set attributes of computed:

Html:

  
  
 {B }}  
 

Js:

Script export default {components :{}, ready: function () {}, methods: {updateData: function () {this. B = this. b; // when B is assigned a value again, the set attribute of B is called to change the value of c }}, data () {return {a: '1: 30 ', c: ''}}, computed: {B: {get: function () {// change the value of B through the value of a var time = this. a; time = time? Time. split (':'): ''; let hours = time [0]; let minutes = time [time. length-1]; return parseInt (hours) * 60 + parseInt (minutes);}, set: function (newValue) {// change the value of B, set the value of c to let newTimes = newValue; let hoursTime = parseInt (newTimes)/60; let minutesTime = parseInt (newTimes) % 60; newTimes = newTimes + ''; hoursTime = hoursTime + ''; hoursTime = hoursTime? HoursTime. split ('. '): ''; this. c = hoursTime [0] + ':' + minutesTime; console. log (hoursTime [0] + ':' + minutesTime) ;}}} script