問題:methods中的某一個方法用es6箭頭函式寫的,訪問不到例項中的變數,後來輸出了this,發現指向了元件export的物件,並非例項(嚴格模式下undefined)。
解決: 將methods中的方法全部改為es5寫法編寫。
原因: 箭頭函式會繫結到ParentContext,造成訪問例項失敗。
預防: 1. 在需要用到例項中屬性的時候,儘量使用es5函式編寫。
2. 文件中其實就已經提到不應該使用箭頭函式來定義 method 函式,以後看文件要更加仔細。
引申: es6箭頭函式需要注意的第一個點: 函式體內的this物件即定義時所在的物件,而不是使用時所在的物件。例如在函式中使用setTimeout,並不會改變this物件的指向到window,而是依然指向函式所在的物件。 箭頭函式本沒有自己的this, 其內部的this就是外層程式碼塊的this。因此,箭頭函式不能用作建構函式。
可以充分利用箭頭函式的this繫結性來進行函式體內的各種函式巢狀。
延展: 由於箭頭函式的侷限性,es7提出了函式繫結運算子,即::運算子,用來取代call, apply, bind呼叫。
foo::bar; //等同於
bar.bind(foo);