RN的父传子和子传父及方法调用(函数式组件)

在React Native (RN) 中，父传子可以通过props进行，子传父可以通过回调函数进行。以下是一个简单的示例：

父组件：

import React, { useState } from 'react';
import { View, Text, Button } from 'react-native';
import ChildComponent from './ChildComponent';
 
const ParentComponent = () => {
  const [childData, setChildData] = useState('');
 
  const sendDataToChild = data => {
    setChildData(data);
  };
 
  return (
    <View>
      <Text>{childData}</Text>
      <ChildComponent sendData={sendDataToChild} />
      <Button
        title="Send Data to Child"
        onPress={() => sendDataToChild('Hello from Parent')}
      />
    </View>
  );
};
 
export default ParentComponent;

子组件：

import React from 'react';
import { View, Text, Button } from 'react-native';
 
const ChildComponent = ({ sendData }) => {
  const sendDataToParent = () => {
    sendData('Hello from Child');
  };
 
  return (
    <View>
      <Button title="Send Data to Parent" onPress={sendDataToParent} />
    </View>
  );
};
 
export default ChildComponent;

在这个例子中，ParentComponent 使用了函数式状态 hook useState 来管理从 ChildComponent 接收的数据。ChildComponent 接收一个名为 sendData 的props，该props是一个函数，可以被调用来将数据发送回父组件。当按下按钮时，父组件的数据将通过按钮点击事件发送到子组件，子组件的数据也是通过点击事件发送回父组件的。