关于vue监听watch详解

做项目时遇到了 对象属性改变 但是监听不了的问题，网上百度了一下关于watch里面handler的详解，找到了原因如下，现做个笔记方便自己
原贴链接：https://juejin.im/post/5c3702a46fb9a049fa0ff5f8

普通监听

缺点：不能深度监听（对象属性的改变），刷新或首次加载不能执行。

watch: {
            carts: function (val, oldVal) {
                console.log('new: %s, old: %s', val, oldVal)
            }
        }

高级监听

• handle：watch中需要具体执行的方法。
• immediate：true立即执行handle方法（首次加载、刷新、数据改变）都会执行，缺点监听不到对象属性中发生的改变。

watch: {
            carts: {
                handler(val, oldVal) {
                    console.log('new: %s, old: %s', val, oldVal)
                },
                immediate: true
            }
        },

• deep：true深度检测。例如数组对象中的某个属性改变执行handle方法。

watch: {
            carts: {
                handler(val, oldVal) {
                    console.log('new: %s, old: %s', val, oldVal)
                },
                deep: true
            }
        },