React Native组件传参问题：如何复用WebSocket组件传递数据？

• 组件名称不匹配是核心问题
  你定义的组件是WebSocket，但在InstrumentList中使用的是WebSocketGC1——React无法识别未定义的组件，导致传参完全不生效。修正时需统一组件名称：

  修正后的InstrumentList代码：

  const InstrumentList = () => {
    // 确保此处正确定义/导入GC1_URL、socketFirstRequest、socketSecondRequest
    const GC1_URL = "你的实际socket地址";
    const socketFirstRequest = { /* 你的第一个请求参数结构 */ };
    const socketSecondRequest = { /* 你的第二个请求参数结构 */ };
  
    return (
      <View style={styles.container}>
        {checkStatus === false && (
          <WebSocket
            socketUrl={GC1_URL}
            socketFirstRequest={socketFirstRequest}
            socketSecondRequest={socketSecondRequest}
          />
        )}
      </View>
    );
  }
  

• 确保组件正确导出与导入
  在WebSocket组件文件中完成导出：

  const WebSocket = ({
    socketUrl,
    socketFirstRequest,
    socketSecondRequest,
  }) => {
    // 此处编写socket连接、数据发送逻辑
    return null; // 根据实际需求返回UI元素或null
  };
  
  export default WebSocket; // 默认导出，也可使用命名导出
  

  然后在InstrumentList文件中导入组件：

  import WebSocket from './你的WebSocket组件文件路径'; // 替换为实际文件路径
  

• 确认父组件参数有效性
  保证GC1_URL、socketFirstRequest、socketSecondRequest在InstrumentList组件内是已定义的有效变量，避免出现未定义报错。

内容的提问来源于stack exchange，提问作者Manish Kumar