RN 总结-传值
传值
一、当前界面：
1、初始化
state = {
waiting: true,
orderSort: '1',
orderStatus: '0',
cityId: '-1',
data: [],
cityList: [],
refreshState: RefreshState.Idle,
}
2、取值
this.state.orderSort,
this.state.orderStatus
3、 赋值
this.setState({ waiting: true })
this.setState({
refreshState: page === 5 ? RefreshState.NoMoreData : RefreshState.Idle,
data,
waiting: false,
})
4、请求示例：有取值赋值
api.getOrderList(JZGOrderType.JZGOrderTypeOnLine, '2', this.state.orderSort, this.state.orderStatus, operation, page, '', this.state.cityId)
.then((res1) => {
// console.log('res1', res1)
if (res1.status === 100) {
const data = res1.AppraiseList || []
callback(data, { allLoaded: false })
this.setState({
refreshState: page === 5 ? RefreshState.NoMoreData : RefreshState.Idle,
data,
waiting: false,
})
} else {
Toast.show(res1.msg)
callback([], { allLoaded: false })
this.setState({
refreshState: RefreshState.Failure,
waiting: false,
})
}
})
.catch((error1) => {
Toast.show(error1.message)
callback([], { allLoaded: false })
this.setState({
refreshState: RefreshState.Failure,
waiting: false,
})
})
}
二、A界面—>B界面
1、 A传参数到B界面：
利用导航跳转传值：
某种事件触发操作，调用方法：
写法1：
onPress={() => navigate('UpdateName', {callBackName:this.onPressNameCallBack,name:this.state.name})}
或者，写法2：
onPress={this.onPressSex}
onPressSex = ()=>{
console.log('性别点击。。。');
const { navigate } = this.props.navigation;
navigate('UpdateSex', {sex:this.state.sex})
}
参数1：跳转的界面名字：UpdateName
参数2：是一个对象，可以携带多个key-value值
{callBackName:this.onPressNameCallBack,name:this.state.name}
callBackName:this.onPressNameCallBack
callBackName：A界面的回调方法，一般用于B界面返回到A界面时回传参数使用
this.onPressNameCallBack：A界面定义的回调方法，可以有参数
name:this.state.name
name：A界面传给B界面要使用的值
onPressNameCallBack = (item)=>{
console.log('姓名点击回调。。。')
}
三、B界面—>A界面
B界面接收参数并调用A界面的回调方法：
1、定义局部变量，获取A界面的值
在render()方法或者自定义方法中定义变量，获取A界面的值
render() {
console.log('this.props xxx', this.props.navigation)
const { navigate } = this.props.navigation;
const { params } = this.props.navigation.state;
const { name, callBackName } = params;
}
2、定义全局变量，获取A界面的值
全局变量：当前类中全局可用，
static定义的：是类似于OC中的类方法，不能使用全局的变量
注意：
全局变量必须放到constructor系统方法中，同时，this.state初始化也必须放到constructor中
constructor(props) {
super(props) //必须调用父类的方法
const { navigate } = props.navigation;
const { params } = this.props.navigation.state;
const { name, callBackName } = params;
this.callBackName = callBackName
this.state = {
orderSort: '1',
}
}
3、B界面调用回调方法
3.1 普通回调：
var item = {name:'李四'}
this.callBackName(item)
3.2 导航回调
由于导航按钮是定义在static中的，类似于OC中的类方法，不用使用this去调用方法，
所以需要先在生命周期方法【componentDidMount()】中将对象方法设置到Params中，
接着使用onPress={()=> navigation.state.params.onPushNew()方式调用
