鍍金池/ 問(wèn)答/人工智能  網(wǎng)絡(luò)安全  HTML/ Vue項(xiàng)目中 使用 Charles 代理 ,加載了三次 Js 導(dǎo)致雙向數(shù)據(jù)綁定失

Vue項(xiàng)目中 使用 Charles 代理 ,加載了三次 Js 導(dǎo)致雙向數(shù)據(jù)綁定失效。

由于需要測(cè)試本地的代碼,所以將線上的項(xiàng)目的js代理到本地,線上項(xiàng)目有 mainifest.js、vendor.js、app.xxx.js。犯了個(gè)錯(cuò)誤將被替換的js路徑寫(xiě)成了*,所以三個(gè)js都代理了本地webpack起的server上的js,導(dǎo)致項(xiàng)目加載三次。

理應(yīng)這也沒(méi)關(guān)系,但是問(wèn)題出來(lái)了,雙向數(shù)據(jù)綁定失效了??

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

<script>
    export default {
        data() { return { num: 10 } },
        created() {
            setTimeout(() => {
                this.num = 20;  // 這里的num就不會(huì)加載上去
                console.log(this); // 控制臺(tái)查看this對(duì)象,內(nèi)部的num值已經(jīng)變20了,頁(yè)面中就是不變
            })
        }
    }
<script>

為什么會(huì)這樣,求大神解答

回答
編輯回答
怣人

語(yǔ)法錯(cuò)誤
data() { num: 10 },
這是方法,得return一個(gè)對(duì)象.
組件的話,data應(yīng)該是一個(gè)返回對(duì)象的函數(shù),保證這個(gè)組件的data被閉包保護(hù),不會(huì)與其他組件實(shí)例共享一個(gè)引用.

2018年6月13日 03:49