todolist.js
import react,
from
'react'
;import
'antd/dist/antd.css'
;import store from
'./strore/index'
;import
from
'./strore/actioncreators'
;import todolistui from
'./todolistui'
;//todolist這個元件或者說這個類，在js裡面乙個類裡面一定會有constructor建構函式,當我們建立乙個todolist例項
class
todolist
extends
component
handleinputchange
(e)handlestorechange()
handlebtnclick()
handleitemdelete
(index)
componentdidmount()
)}//父元件通過屬性的形式向子元件傳遞引數，既可以傳遞資料也可以傳遞方法
//子元件通過props接收父元件傳遞過來的引數
render()
list=
handleinputchange =
handlebtnclick =
handleitemdelete =
/>);
}}export
default todolist;
import react from
'react'
;import
from
'antd'
;//props是父元件傳遞過來的內容
const
todolistui
=(props)
=>
}>
placeholder=
"todo info" style=
} onchange=
/>
"primary" onclick=
>提交<
/button>
<
/div>
style=
} size=
"small"
bordered
datasource=
renderitem=
}>
<
/list.item>)}
/>
<
/div>);
}export
default todolistui;子元件修改父元件的資料方法：子元件呼叫父元件裡的方法然後改變父元件裡的資料，只需要把父元件的方法傳給子元件就可以了
以上**不能用關鍵字delete，懶得改了。。。嘿嘿。。。但是邏輯是對的。。。
父元件通過屬性的方式向子元件傳遞資料和方法，子元件通過this.props.***的方法接收父元件傳遞過來的資料和方法。
React 高階內容
1 使用 proptypes 型別檢查 官網 使用 proptypes 型別檢查 import react,from react import proptypes from prop types class todoitem extends component render this.props r...
react生成動態內容
效果 結構 if window.confirm 確認刪除？editthis this.props editul index render import react from react import todo2 from todo2 constructor props editstatus 1,de...
React基礎 元件
元件從概念上看就像是函式，它可以接收任意的輸入值 稱之為 props 並返回乙個需要在頁面上展示的react元素。class welcome extends react.component class welcome extends react.component const element sar...