Question

我在 GrandChild.tsx 中有一个函数

GrandChild.tsx

function grandChild(){  
   function a(){ someVariables } 
}

Parent.tsx

function Parent(){
  console.log(someVariables) 
}

如何将数据从 GrandChild 传递给父组件？

我试过这种方法：

Parent.tsx

function Parent(){ 

const (msg, setMsg) = useState('') function getData(){ <Child someVar = {msg}/> }

Child.tsx

interface ChildProps {
 someVar: any;
}

function Child(props: ChildProps){
const (mediator, setMediator) = useState('') 

function mediateData(){ <Child someVariables = {msg}/> } }

GrandChild.tsx

interface GrandChildProps {
 someVariables: any;
}

function GrandChild(props: GrandChildProps){
const (data, sendData) = useState('') 
function a(){ <GrandChild someVariables = {data}/> }

Answer 1

我修复了评论中的代码和框：https://codesandbox.io/s/determined-pine-1z9ms

这里的想法是传递“setMsg”函数并从孙子中调用它

如何在 React Functional 组件中将数据从孙子组件传递给父组件？

1 个答案: