美文网首页
关于Vue中侦听器实现侦听对象的方法

关于Vue中侦听器实现侦听对象的方法

作者: 都江堰古巨基 | 来源:发表于2019-06-03 15:09 被阅读0次

Vue中不能侦听到对象内部属性的变化,要侦听对象内部熟悉的变化,必须这么写:

<html>
    <head>
        <script src="https://vuejs.org/js/vue.js"></script>
    </head>
    <body>
        <div id="app">
            <ul>
                <li v-for="item in items" :key="item.id">
                    {{ item.name }}
                </li>
            </ul>
        </div>
        <script>
            var app = new Vue({
                el: '#app',
                data() {
                    return {
                        items:[
                            {
                                "id": 1,
                                "name": "twy"
                            },
                            {
                                "id": 2,
                                "name": "dw"
                            },
                            {
                                "id": 3,
                                "name": "lisa"
                            }
                        ]
                    }
                },
                methods: {
                    
                },
                watch: {
                    items:{
                        handler:function(k,v){
                            console.log("change!  ")
                        },
                        // immediate用于监测及时的改变
                        // immediate: true,
                        // 关键就是这句!,
                        deep:true,
                    }
                },
                computed: {
                    
                },
            })
        </script>
    </body>
</html>

相关文章

网友评论

      本文标题:关于Vue中侦听器实现侦听对象的方法

      本文链接:https://www.haomeiwen.com/subject/wexwzqtx.html