为什么vue中无法这样对新老变量做比较

Question

在一个interval定时器里面执行一个getAll方法，这个getAll方法会使用axios循环读取某个接口，一旦那个接口数据有变动，就会将新数据写入vue.count中，我现在想实现的是一旦检测到这个vue.count有变化就alert弹框并且audio标签播放声音，但是我发现这样做并没有效果，原因是什么呢？为什么old和new始终是一样的？

Answer 1

watch你值得拥有

Answer 2

因为你vue.old=vue.count这两个始终相等，你后续又用他们做比较，这种场景你可以使用watch实现，或者
先不赋值

if(vue.count===vue.old){
    数据无变化
}else{
    alert('new message')
}

Answer 3

你可以参照这样的写法

    new Vue({
        el: "#app",
        data() {
            return {
                count: ''
            }
        },
        methods: {
            getAll() {
                return new Promise((resolve, reject) => {
                    axios.get('../json/menu.json').then(res => {
                        resolve(res.data)
                    })
                })
            }
        },
        watch: {
            count: function () {
                alert('数据发生变化')
            }
        },
        mounted() {
            let that = this;
            setInterval(async () => {
                that.count = await that.getAll()
            }, 5000);
        }
    })

使用watch来监听count