当前位置 : 主页 > 网页制作 > React >

React-Native ListView onPress – undefined不是对象

来源:互联网 收集:自由互联 发布时间:2021-06-15
我似乎在按下按钮时调用功能.无论我尝试什么方法,我都会得到不同的未定义错误. 我正在运行反应原生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)} />

现在我可以使用第一种方法调用函数.

网友评论