我似乎在按下按钮时调用功能.无论我尝试什么方法,我都会得到不同的未定义错误. 我正在运行反应原生0.24,目前只编码Android设备. 请看下面的代码: class ListPage extends Component { construct
我正在运行反应原生0.24,目前只编码Android设备.
请看下面的代码:
class ListPage extends Component { constructor(props){ super(props); this.nav = props.nav; this.route = props.route; this.ds = new ListView.DataSource({ rowHasChanged: (row1, row2) => row1 !== row2, }); this.state = ({ visible: false, dataSource: this.ds.cloneWithRows(props.fullList), }); } goToPage(name){ this.nav.push({ name: name }); } loadModal() { this.setState({ visible: true }); } list(row){ return ( <View style={styles.box}> <TouchableNativeFeedback underlayColor="#FFF" onPress={this.goToPage.bind(this,'ShowRow')}> <View> ...ShowRow Button </View> </TouchableNativeFeedback> <TouchableNativeFeedback onPress={this.loadModal.bind(this)} > <View style={styles.button}> ...Modal Button </View> </TouchableNativeFeedback> </View> ); } render(){ return ( <View style={styles.container}> <Modal visible={this.state.visible} onRequestClose={() => {this.setState({visible: false}) }} > <View> <Text>I am a Modal!</Text> </View> </Modal> <ListView dataSource={this.state.dataSource} renderRow={this.list} /> </View> ); } }
每当我按任一按钮我得到undefined不是this.goToPage.bind和this.loadModal.bind的对象错误.
如果我试试这个:
render() { //or inside list(row) function goToPage = function(name){ this.nav.push etc etc } loadModal = function() { setState etc... } return ( ...render stuff ) }
它现在说undefined不是this.nav和this.setState的对象
但如果我这样做:
constructor() { ... goToPage = function(name){ props.nav.push(...); } }
它工作…..但我知道这不是正确的方法,我也不能为模态setState.为什么不使用第一种方法?非常感谢.
好的,找到了解决方案.在renderRow中,我需要像这样绑定函数:<ListView dataSource={this.state.dataSource} renderRow={this.list.bind(this)} />
现在我可以使用第一种方法调用函数.