SOURCE

var vm = new Vue({
    el: "#app",
    data: {
        count: 0,
        memorySetterList: [],
        n: 0,
    },
    computed: {
        double: {
            get(){
                return this.count * 2
            },
            set(setVal) {
                this.count = setVal / 2
                this.memorySetterList.push(setVal)
            }
        }
    },
    methods: {
        changeCount() {
            this.count++
        },
        changeDouble() {
            console.log("setBefore:this.double:",this.double)
            this.double++
            console.log("setAfter:this.double:",this.double)
        },
        plus() {
            return this.n++
        }
    }
})

<div id="app">
    <div>计数：{{ double }}</div>
    <button @click="changeCount">改变count</button>
    <button @click="changeDouble">直接改变double</button>
    <div>存储列表：{{ memorySetterList }}</div>
    
    <!-- 值会被缓存 -->
    <div><span>计算属性调用1次：{{ double }}</span><span> 方法调用1次：{{ plus() }</span>
    <div><span>计算属性调用2次：{{ double }}</span><span> 方法调用2次：{{ plus() }</span>
    <div><span>计算属性调用3次：{{ double }}</span><span> 方法调用3次：{{ plus() }</span></div>
</div>