记 Vue 日常开发小技巧(持续更新)

254 阅读1分钟

本文主要是记录一下我平时在使用 vue 开发业务逻辑的时候,遇到的一些问题,使用的小技巧(遇到一个记一个),虽然不是很深的知识,但应该会对各位有一点点帮助(大佬请绕过)

技巧一:在 Vue 中,如果同时监听多个数据的改变,在其中的一个数据发生改变并做出对应的执行。

首先,我们将需要监听的多个数据使用 computed 整合成一个对象,然后使用 watch 进行监听该对象的改变并执行操作。

computed: {
            //同时给changData绑定需要监听的多个数据
            changData() {
                let {channelId, areaId, accountType} = this;
                return {
                    channelId,
                    areaId,
                    accountType
                }
            }
        },
        watch: {
            changData: {
                handler: function(val){
                    if(this.changData.areaId != -1 && this.changData.channelId != -1){
                        this.getAccountSubList()
                    }
                },
                deep: true
            }
        },