Question

我有2个屏幕A和屏幕B。屏幕A有一个子组件Project.transaction do # Create a project with default attributes project = create_draft_project(project_title) # Create a blob before direct upload to generate a signed url blob = ActiveStorage::Blob.create_before_direct_upload!( filename: filename, byte_size: byte_size, checksum: checksum, content_type: content_type ) # Attach the blob to the project by creating the association in the database directly. ActiveStorage::Attachment.create( name: 'file', record_type: 'Project', record_id: project.id, blob_id: blob.id ) end # Render the success response success_response(project, blob)，该子组件加载数据，我只是将操作传递给该子组件，剩下的事情就由它完成。目前，根据设计的反应导航，没有任何操作重新访问。我用Google搜索并遇到了https://reactnavigation.org/docs/en/navigation-events.html，但是当我从ScreenB导航到ScreenA时，不确定如何使用它重新加载SomeList。

ScreenA

SomeList

ScreenB

class ScreenA extends Component {

   render() {
    return (
      <SomeList
        loadData={this.props.actions.getAlllist}
      />
    )
}

Answer 1

由于react-native的设计，我认为最好将数据传递给子Component。

这是您可以执行的操作：

   class ScreenA extends Component {
       constructor(props) {
          super(props)
          this.state = {
            data: [],
          }
          this.props.navigation.addListener('didFocus', this.load)
          this.props.navigation.addListener('willBlur', this.unmount)
        }

       load = ()=>{
          const _data = this.props.actions.getAlllist;
          this.setState({data:_data})
       }
       unmount = ()=>{
          this.setState({data:[]})
       }
       render() {
        return (
          <SomeList
            dataArray ={this.state.data}
          />
        )
    }

};

Answer 2

如果您希望在每次渲染某些东西时都获取数据，则可以使用 componentDidMount 生命周期方法

class ScreenA extends Component {
   state = {
     data: [];
   }

   componentDidMount() {
     this.setState({ data: this.props.actions.getAlllist });
   }

   render() {
    return <SomeList loadData={this.state.data}/>;
}

因此，每次渲染 ScreenA 屏幕时，它都会获取数据。

反应本地重载子组件

2 个答案: