Warning: file_get_contents(/data/phpspider/zhask/data//catemap/0/react-native/7.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Ios 应该把道具传给另一个屏幕吗_Ios_React Native_Shoutem - Fatal编程技术网

Ios 应该把道具传给另一个屏幕吗

Ios 应该把道具传给另一个屏幕吗,ios,react-native,shoutem,Ios,React Native,Shoutem,我已成功地将道具传递到另一个屏幕,但如何在第二个屏幕上全局使用道具 我需要能够在所有函数中使用从屏幕1传递的道具,包括render(),因为我正在使用道具中的数据进行提取调用,并在render()调用中使用相同的道具数据 例如,我需要这样做: constructor(props) { super(props); this.state = { data: [], rowData: this.props, } } getData() {

我已成功地将道具传递到另一个屏幕,但如何在第二个屏幕上全局使用道具

我需要能够在所有函数中使用从屏幕1传递的道具,包括
render()
,因为我正在使用道具中的数据进行提取调用,并在
render()
调用中使用相同的道具数据

例如,我需要这样做:

constructor(props) {
    super(props);
    this.state = {
      data: [],
      rowData: this.props,
    }
  }

  getData() {
    this.setState({
      rowData: this.props
    });
    return fetch('https://mywebsite.com/'+this.state.rowData.something+'/myotherdata')
      .then((response) => response.json())
      .then((responseJson) => {
        this.setState({
          data: responseJson.data
        });
      })
      .catch((error) => {
        console.error(error);
      });
  }

  componentDidMount() {
    this.getData();
  }

  render() {      

    return (
      <ScrollView>
        <Image styleName="large-banner" source={{ uri: rowData.image &&
        rowData.image ? rowData.image : undefined }}>
          <Tile>
            <Title>{rowData.name}</Title>
            <Subtitle>{rowData.createdAt.datetime}</Subtitle>
          </Tile>
        </Image>

        <Row>
          <Text>Company: {rowData.company}</Text>
        </Row>

        <Divider styleName="line" />

        <Row>
          <Icon name="laptop" />
          <View styleName="vertical">
            <Subtitle>Visit webpage</Subtitle>
            <Text>{rowData.url}</Text>
          </View>
          <Icon name="right-arrow" />
        </Row>

        <Divider styleName="line" />

        <View style={{paddingTop: 20}}>
          <Progress.Bar progress={this.state.data.progress * .1} width={200} />
        </View>

        <Divider styleName="line" />

      </ScrollView>
    );
  }

据我所知,您有两种选择:

1) 当您第一次收到道具时,您可以将它们存储在组件状态中,然后可以通过调用this.state在当前组件中的任何位置引用它们

2) 您可以使用Redux将所有数据存储在Reducer中,然后它们将在mapStateToProps和connect中的每个组件中都可用

选择哪一个,取决于您需要遵循此体系结构的次数和组件数量

你可以在他们的官方文档中获得更多关于Redux的信息。以下是他们提供的一个简单示例:


希望有帮助。

据我所知,您有两种选择:

1) 当您第一次收到道具时,您可以将它们存储在组件状态中,然后可以通过调用this.state在当前组件中的任何位置引用它们

2) 您可以使用Redux将所有数据存储在Reducer中,然后它们将在mapStateToProps和connect中的每个组件中都可用

选择哪一个,取决于您需要遵循此体系结构的次数和组件数量

你可以在他们的官方文档中获得更多关于Redux的信息。以下是他们提供的一个简单示例:


希望有帮助。

我更新了我的问题,但不断出现错误。请参阅上面的更改。另外,如果您有一个代码示例,它将非常有用。您将在componentDidMount上获取数据,因此呈现方法将在getData之前运行。当组件尝试呈现时,它希望this.state.data是一个包含“progress”键的对象,但它在构造函数中被定义为数组。您可能有2个选项:1在componentWillMount中调用getData,因此它将在调用render方法之前被触发。或者,您可以将数据设置为空对象,并在尝试访问它之前检查this.state.data是否不等于null。希望有帮助。我更新了我的问题,但不断出现错误。请参阅上面的更改。另外,如果您有一个代码示例,它将非常有用。您将在componentDidMount上获取数据,因此呈现方法将在getData之前运行。当组件尝试呈现时,它希望this.state.data是一个包含“progress”键的对象,但它在构造函数中被定义为数组。您可能有2个选项:1在componentWillMount中调用getData,因此它将在调用render方法之前被触发。或者,您可以将数据设置为空对象,并在尝试访问它之前检查this.state.data是否不等于null。希望能有帮助。
<Progress.Bar progress={this.state.data.progress * .1} width={200} />