【一周】2016.12.12-2016.12.18

Plan Done Mark
【任務(wù)】所有靜態(tài)頁面 DONE 接口也基本對(duì)接完畢,但是模板還需要修改
【學(xué)習(xí)】CSS彈性盒布局和側(cè)邊欄 UNFINISHED 忘了上星期沒做,這星期沒安排
【學(xué)習(xí)】ES6解構(gòu)賦值和Module DONE
【學(xué)習(xí)】React臨摹所有商品頁 DONE
【看書】《切爾貝利諾》 0-50頁
【電影】十二夜與永恒,總結(jié) DONE 1

總結(jié)

  • 做靜態(tài)和接口對(duì)接時(shí)狀態(tài)不太佳,磨磨蹭蹭的,找個(gè)文件也要找好幾分鐘。約定很重要,希望定個(gè)公司開發(fā)規(guī)定,這樣能在每個(gè)item的地方都添加文件名作為一個(gè)有意義的class,再配合ctrl+p這么神奇的功能,找文件只需要好幾秒的事。
  • 這個(gè)星期的React頁面用ES6語法(上星期主要是用React.createClass,這星期用class),主要遇到的問題:
    1. getInitialState函數(shù)在class內(nèi)不生效,ES6用constructor來初始化,還有constructor特別容易拼錯(cuò)...參考文檔
    2. class中的綁定事件與createClass中也有不同,在事件綁定處是用<div data={this.state.data} onClick={this.handler.bind(this)}/>必須要bind(this),否則handler處理函數(shù)里面的this是div
    3. JSX中
render() {
        return <ul>
            this.state.data.map(function(item,index){
                <li key={index} data-index={index} onClick={this.handler}/>
            })
        </ul>
}
handler (event){
        console.log(event.target.dataset.index);
}

在handler函數(shù)中
console出來的有時(shí)是undefined,不能用event.target,要用event.currentTarget,參考文檔

  1. React聲明周期
    react生命周期.png

    onclick事件處理后的setState會(huì)觸發(fā)重新渲染,但是執(zhí)行的是componentWillUpdate而不是WillMount事件,這個(gè)要記清楚了。然后再willUpdate上是最好不要寫setState的,否則會(huì)不停地觸發(fā)渲染循環(huán)。
    setState也是有個(gè)性的。
  • css是可以直接畫icon的。
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

推薦閱讀更多精彩內(nèi)容

  • GUIDS 第一章 為什么使用React? React 一個(gè)提供了用戶接口的JavaScript庫。 誕生于Fac...
    jplyue閱讀 3,595評(píng)論 1 11
  • 原教程內(nèi)容詳見精益 React 學(xué)習(xí)指南,這只是我在學(xué)習(xí)過程中的一些閱讀筆記,個(gè)人覺得該教程講解深入淺出,比目前大...
    leonaxiong閱讀 2,860評(píng)論 1 18
  • 本筆記基于React官方文檔,當(dāng)前React版本號(hào)為15.4.0。 1. 安裝 1.1 嘗試 開始之前可以先去co...
    Awey閱讀 7,805評(píng)論 14 128
  • 工具準(zhǔn)備 鉛筆(或者自動(dòng)筆)、黑色中性筆(或者針管筆)、橡皮、尺子、A4紙張 繪制步驟 步驟1: 用鉛筆畫一個(gè)5...
    汪雋子的簡(jiǎn)書閱讀 644評(píng)論 0 6
  • 目錄 上一章 刺殺愛情8 三日后,拓桑大喜,接龍客棧免費(fèi)一天,客棧里的人絡(luò)繹不絕。 遠(yuǎn)處的鞭炮與嗩啦聲響交替,熱...
    若無其事冥閱讀 273評(píng)論 0 6