1.父組件傳值給子組件??
父組件給子組件傳值 react 和vue都是很相似的 , 很簡單
1.父組件引入子組件?
import Fashbases from './Fashbases'
2.在子組件上直接傳值
<Fashbases? child='父元素傳遞的值' ></Fashbases>?
3.在子組件上通過this.props.child 接收父組件傳過來的值??
????<Text>這個也是測試,{this.props.child}</Text>??
2.子組件給父組件傳值??
子組件給父組件傳值 相當于父組件傳遞方法給子組件 子組件通過調用父組件的方法 ,把需要傳遞的值寫在形參即可??
1.父組件進入子組件??
import Fashbases from './Fashbases'
2.在父組件中定義方法?
_parentClick = (item)=>{? ? ? ? console.warn('父組件的方法'+'子組件內容'+item);? ? ? ? ?}
3.在子組件上傳遞方法??
<Fashbases parentClick={this._parentClick}>? ? ? ?</Fashbases>? ?
4.在子組件中通過this.props. parentClick('傳值' )?
<TouchableOpacity onPress={()=>{this.props.parentClick('childer')}}></View>?
這樣就把子組件想要傳遞的參數傳遞給了父組件 ,?
3.在子組件中展示父組件的樣式??
一般這樣寫在引用的子組件的樣式? 是會被子組件忽略的 ,但是 如果在子組件中通過this.props.childer引入就不會被忽略
4.父組件調用子組件的方法??
在React Native中是有體現的 , 父組件調用組組件的方法是十分有用的??
父組件調用子組件的方法 通過ref來獲取子組件的dom元素? ,??
在子組件中定義方法即可 ,
5.父組件在調用子組件的時候還可以書寫‘slot’ 不過,react中這只不過是個標志而已??
可以在父組件引用的子組件中書寫? slot=‘right’??
可以通過this.props.slot 獲取right? , 這樣你可以判斷自己 的組件放在什么位置? ,最后可以通過flex布局完成自己想要的? ,不同的是vue是封裝好的而react 你需要自己模擬這個過程??