javascript - vue响应式的问题

问题描述

问 题

<div id="app">
    <h1>
        {{ count.id }}
    </h1>
    <h2>
        {{ item[0].id }}
    </h2>
</div>
<script>
let vm = new Vue({
    el: '#app',
    data () {
        return {
            item: [
                {
                    id: 60
                }
            ],
            count: {}
        }
    },
    mounted () {
        this.count = this.item[0];  // 赋值给count
    }
});
</script>

在控制台里打印： vm.count.id--

会发现 items.id 也跟着改了。我明明只改 count.id

如何避免同步？ 我只想更改 count.id；

解决方案

浅拷贝和深拷贝的问题。

这篇关于javascript - vue响应式的问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！