javascript - React Native 通过react-navigation传递数据

标签 javascript react-native react-navigation

我想在单击按钮时将数据传递到另一个屏幕。我正在使用 router-flux 并且它工作得很好,但是在 react 导航上它不起作用。 因此,在 router-flux 上,单击按钮时,它会调用此函数:

  onSearch() {
    fetch(`URL`, {
        method: 'GET',
        })
      .then((response) => { return response.json() } )
      .then((responseJson) => {
        Action.results({data: responseJson});
      })
      .catch((error) => {
        Alert.alert("0 Cars!");
      });
  }

但是在 react 导航上,如果我将代码更改为:

  onSearch() {
    fetch(`URL`, {
        method: 'GET',
        })
      .then((response) => { return response.json() } )
      .then((responseJson) => {
        this.props.navigation.navigate('Resultados', { data: responseJson });
      })
      .catch((error) => {
        Alert.alert("0 Cars!");
      });
  }

这不起作用,我总是收到警报“0 Cars!”。 我究竟做错了什么?在 router-flux 上,这非常简单。

这就是我调用 onSearch 函数的方式:

    <Button onPress={this.onSearch} style={{backgroundColor: '#f48529', width: 140, borderRadius: 30, height: 40}} >
        <Text style={{color: 'white', fontFamily: 'rubik-light', fontSize: 17}}>Search</Text>
        <Icon size={15} name={'search'} color={'white'} />
    </Button>

最佳答案

尝试将 onPress={this.onSearch} 更改为 onPress={this.onSearch.bind(this)}

还有

尝试

onSearch() {

    const { navigate } = this.props.navigation;

    fetch(`URL`, {
        method: 'GET',
        })
      .then((response) => { return response.json() } )
      .then((responseJson) => {
        navigate('Resultados', { data: responseJson });
      })
      .catch((error) => {
        Alert.alert("0 Cars!");
      });
  }

关于javascript - React Native 通过react-navigation传递数据,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43475448/

相关文章:

javascript - 在 setTimeout 期间阻止函数执行

react-native - React Native 如何从 url 渲染 svg

ios - 使用 Express 连接到 Amazon RDS

javascript - 隐藏div直到完全加载并在js onclick slider 上添加淡入淡出效果

javascript - Jquery Steps 停止日期选择器工作?

javascript - 如何在 React Native 的一个功能组件中同时使用 props 和 navigation

reactjs - React Native - React Navigation 在每个页面上显示页眉和页脚

react-native - 更改导航标题背景颜色

java - 如何将参数传递给 JSF 2.0 页面上的 javascript 函数

javascript - 如何在 native react 中验证 TextInput 值?