vue computed

1new Vue({
2  el: '#app',
3  data: {
4    text: 'Hello'
5  },
6  components: {
7    'child' : {
8      template: `<p>{{ myprop }}</p>`,
9      props: ['myprop'],
10      watch: { 
11      	myprop: function(newVal, oldVal) { // watch it
12          console.log('Prop changed: ', newVal, ' | was: ', oldVal)
13        }
14      }
15    }
16  }
17});

1var vm = new Vue({
2  el: '#demo',
3  data: {
4    firstName: 'Foo',
5    lastName: 'Bar',
6    fullName: 'Foo Bar'
7  },
8  watch: {
9    firstName: function (val) {
10      this.fullName = val + ' ' + this.lastName
11    },
12    lastName: function (val) {
13      this.fullName = this.firstName + ' ' + val
14    }
15  }
16})

1  computed: {
2    returnSomething: function () {
3      return this.something
4    }
5  }

1// ...
2computed: {
3  fullName: {
4    // getter
5    get: function () {
6      return this.firstName + ' ' + this.lastName
7    },
8    // setter
9    set: function (newValue) {
10      var names = newValue.split(' ')
11      this.firstName = names[0]
12      this.lastName = names[names.length - 1]
13    }
14  }
15}
16// ...

1export default {
2	computed:{
3		test(){
4			return this.course.image
5		}
6	}
7	,
8	props:['course'],
9}

1var vm = new Vue({
2  el: '#example',
3  data: {
4    message: 'Hello'
5  },
6  computed: {
7    // a computed getter
8    reversedMessage: function () {
9      // `this` points to the vm instance
10      return this.message.split('').reverse().join('')
11    }
12  }
13})