Javascript 如何获取另一个文件中组件的状态

我想弄明白这一点已经有一段时间了，但我似乎不太明白怎么做。
我有一个屏幕，它本质上是一个表单，但所有组件都位于不同的文件中（通常是这样）。我不能理解的是（我在网上搜索了一些查询，比如：

如何从父级获取自定义react组件的状态等，我什么都想不出来）如何获取组件的状态，其中状态更改函数位于不同的文件中。据我所知，react native中没有DOM操作，因为我在web上这样做的方式是：

const stateValue = document.querySelector('#thingIWantToGetTheValueOf').value;

但据我所知，你不能在家里这样做。下面是我正在使用的代码，然后我将把它简化为一个问题：

// SubmitReferralScreen.js
      <PageTemplate headerText='New Referral' needsBackButton='true' navBar='true' needsFocus='Referrals'>
            <KeyboardAvoidingView behavior='padding' style={styles.formContainer}>
              <View style={styles.inputContainer}>
                <GeneralInput autoFocus='true' labelText='Referral Name' type='default' placeholder='Full Name' />
                <GeneralInput labelText='Phone Number' type='phone-pad' placeholder='(555) 123-4567' />
                <Picker selectedValue={this.state.relationship} onValueChange={(itemValue, itemIndex) => this.setState({relationship: itemValue})} style={styles.picker}>
                  <Picker.Item label='Friend' value='friend' />
                  <Picker.Item label='Family Member' value='family' />
                  <Picker.Item label='Select' value='' />
                  <Picker.Item label='Co Worker' value='coworker' />
                </Picker>
                <GeneralInput labelText='Email' type='email-address' placeholder='email@shinesolar.com' />
              </View>
              <IconButton navigateTo='YayReferral' buttonText='Submit Referral' />
            </KeyboardAvoidingView>
      </PageTemplate>

//SubmitReferralScreen.js
this.setState（{relationship:itemValue}）style={styles.picker}>



//GeneralInput.js
导出类GeneralInput扩展React.Component{
建造师（道具）{
超级（道具）；
此.state={
占位符：this.props.placeholder，
输入值：“”，
输入：false，
};
}
whenInputIsFocused（）{
this.setState（{占位符：}）；
}
当计算机变得模糊时（）{
如果（this.state.inputValue==“”）{
this.setState（{占位符：this.props.placeholder}）；
}
}
render（）{
const autoFocus=this.props.autoFocus=='true'；
返回(
{this.props.labelText}
this.setState（{inputValue}）}
value={this.state.inputValue}
secureTextEntry={this.props.secureTextEntry}
onBlur={this.whenInputisblued.bind（this）}
onFocus={this.whenInputIsFocused.bind（this）}
underlineColorAndroid=“透明”
keyboardType={this.props.type}
returnKeyType={this.props.returnKeyType}
占位符={this.state.placeholder}
占位符textcolor='rgba（255，255，255，0.3）'
style={styles.inputStyles}/>
);
}
}

在SubmiterFerralScreen中，当按下
IconButton
时，我想收集所有通用输入（和选择器）的值，如果它们通过一些验证，则提交表单。但是，由于状态更改函数保存在GeneralInput.js中，我不知道如何访问这些组件的状态。
如何访问从另一个文件夹导入的组件的状态？
要实现这一点，您需要在
组件中实现一个函数，该函数可以传回数据并在父级中设置有状态信息

然后，您可以决定在何处管理
GeneralInput
的状态，在该状态下，它只是将值传回（在状态更改时）给父级，或者父级是否管理该值

此外，我相信你可以在球场上使用一个球，然后把球传回来，但是我并不建议你这样做

在父控制器中：

<GeneralInput
   autoFocus='true'
   labelText='Referral Name'
   type='default'
   placeholder='Full Name'
   onChange={this.handleChange} //added line
 />

// class method outside of render
onChange = ({key, value}) => { 
    this.setState({key, value});
}


//在render外部初始化方法
onChange=（{key，value}）=>{
this.setState（{key，value}）；
}

//GeneralInput.js

<TextInput 
  onChangeText={this.storeValue}
  ...
/>

//outside of render method
storeValue = (inputValue) => {
   this.setState({inputValue})
   this.props.onChange({key: 'myField', value: inputValue})
} 


//外部渲染方法
storeValue=（inputValue）=>{
this.setState（{inputValue}）
this.props.onChange（{key:'myField'，value:inputValue}）
} 

再说一次，我根本不建议这样做。自上而下的担忧意味着您需要更高层次地管理事情，或者使用mobx/redux之类的工具来进行沟通，而不是管理。此外，如果你这样做，我会让真相的源头在你的父母而不是孩子身上，并相应地传递值。
添加redux并使用：）@Petrogad redux是一个太多的错误，我听说它对于React Native来说是不稳定的，我的想法一直是“如果x库可以做到这一点，那么必须有一种方法我也可以做到。”我很想知道redux的“buggyness”。我还没有发现任何redux的bug，这些bug不是由我自己糟糕的编码决策造成的。此外，创建匿名内联函数（根据你的onChangeText）导致代码出现性能瓶颈。所以我想这就是我的问题，如何将数据传回？
<TextInput 
  onChangeText={this.storeValue}
  ...
/>

//outside of render method
storeValue = (inputValue) => {
   this.setState({inputValue})
   this.props.onChange({key: 'myField', value: inputValue})
}