2017.03.03
- 計(jì)劃
- 完善hM側(cè)邊欄組件化
- Object對(duì)象
- Object詳解
- 實(shí)際完成
- 完善hM側(cè)邊欄組件化
- 將彈出框也封裝
- 總結(jié)
Cannot call a class as a function at _classCallCheckbabel之class處理Step1: 定義
Class Person{} 被編譯為：
function _classCallCheck(instance, Constructor) {
// 檢查是否成功創(chuàng)建了一個(gè)對(duì)象
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
}
var Person = function Person() { _classCallCheck(this, Person); };
```
你可能會(huì)一頭霧水,_classCallCheck是什么？其實(shí)很簡(jiǎn)單前弯，它是為了保證調(diào)用的安全性盏缤。
比如我們這么調(diào)用：
// ok ` new p = new Person();`
是沒有問題的誓竿，但是直接調(diào)用：
// Uncaught TypeError: Cannot call a class as a function Person();
就會(huì)報(bào)錯(cuò)纳猫，這就是_classCallCheck所起的作用婆咸。具體原理自己看代碼就好了，很好理解芜辕。
我們發(fā)現(xiàn)尚骄，Class關(guān)鍵字會(huì)被編譯成構(gòu)造函數(shù)，于是我們便可以通過new來實(shí)現(xiàn)實(shí)例的生成侵续。
Step2：Constructor探秘
我們這次嘗試加入constructor,再來看看編譯結(jié)果：
class Person() { constructor(name) { this.name = name; this.type = 'person' } }
編譯結(jié)果：
var Person = function Person(name) { _classCallCheck(this, Person); this.type = 'person'; this.name = name; };
看上去棒極了倔丈，我們繼續(xù)探索憨闰。
- class Menu {}
若在object中 { menu: Menu }，調(diào)用會(huì)報(bào)錯(cuò)需五。class不能以對(duì)象形式調(diào)用起趾，雖然會(huì)解析成function Menu () {}。
只能通過new Menu() 去調(diào)用警儒。
參考：寫一個(gè)微信小程序自定義公共組件
內(nèi)調(diào)用class 是 App({ LoginPannel })
new app.LoginPannel()- template 使用展開的數(shù)據(jù)是
data="{{ ...obj }}"， 若page.data上沒有定義 obj 眶根，在template 內(nèi)使用wx:for循環(huán)輸出列表會(huì)報(bào)錯(cuò)蜀铲。就算在onLoad事件上setData也是有誤的。
VM18377:2 firstRender not the data from Page.datafirstRender not the data from Page.data;firstRender not the data from Page.data Error: firstRender not the data from Page.data
