Vue项目中 使用 Charles 代理 ，加载了三次 Js 导致双向数据绑定失效。

Question

由于需要测试本地的代码，所以将线上的项目的js代理到本地，线上项目有 mainifest.js、vendor.js、app.xxx.js。犯了个错误将被替换的js路径写成了*，所以三个js都代理了本地webpack起的server上的js，导致项目加载三次。

理应这也没关系，但是问题出来了，双向数据绑定失效了？？

<template><div>{{num}}</div></template>

<script>
    export default {
        data() { return { num: 10 } },
        created() {
            setTimeout(() => {
                this.num = 20;  // 这里的num就不会加载上去
                console.log(this); // 控制台查看this对象，内部的num值已经变20了，页面中就是不变
            })
        }
    }
<script>

为什么会这样，求大神解答

Answer 1

语法错误
data() { num: 10 },
这是方法,得return一个对象.
组件的话,data应该是一个返回对象的函数,保证这个组件的data被闭包保护,不会与其他组件实例共享一个引用.