() 在class中调用this.props.title.length报错


render{ return //这里调用.length是成功执行的 <TouchableOpacity onPress={=>{alertthis.props.rightTitle.length}}> <View style={styles.container}> <Text style={{marginLeft:8}}>{this.props.title}</Text> {this.renderRightView} </View> </TouchableOpacity> } renderRightView==>{ ifthis.props.isSwitch{ return <Switch value={this.state.isOn == true} onValueChange={=>{this.setState{isOn:!this.state.isOn}}} style={{marginRight:8}}/> } else{ return <View style={{flexDirection:row,alignItems:center}}> {this.rightTitleView} <Image source={{uri:icon_cell_rightArrow}} style={{width:8,height:13,marginRight:8}}/> </View> }
} rightTitleView{
//这里调用.length是会报错的 ifthis.props.rightTitle.length { return <Text style={{color:gray,marginRight:3}}>{this.props.rightTitle}</Text> }
}

具体错误是:undefined is not an object evaluating this.props.rightTitle.length

是不是rightTitleView应该写成rightTitleView==>{}

rightTitleView需要绑定this,否则获取不了props。

好端端的renderRightView为什么要写成箭头函数?
箭头函数是回调,回调就要bindthis。

这边this已经指向TouchableOpacity 了,当然没了,可以手动绑定this,一般是在constructor函数中,

this.renderRightView = this._renderRightView.bindthis
this.rightTitleView = this._rightTitleView.bindthis

也可以用autobind-decorator库来解决这个问题,但是这个需要用到装饰器,需要进行转换一下,配置一下babel就可以

发表评论

电子邮件地址不会被公开。 必填项已用*标注