Vuejs computed set get计算属性

直接贴代码，看注释

 

 

<template>

<div id="example">

<input v-model="reversedMessage">

<p>Original message: "{{ message }}"p>

<p>Computed reversed message: "{{ reversedMessage }}"p>

div>

template>

<script>

export default {

name: 'Compute',

data () {

return {

message: 'Hello'

}

},

computed: { // getter，setter计算属性都有

reversedMessage: {

// getter

get: function () {

console.log('getter called')

return this.message.split('').reverse().join('')

},

// setter

set: function (newValue) {

console.log('newValue: ' + newValue)

this.message = newValue

}

}

}

}

script>