首頁猿問將 React...

將 React 中的道具從一個文件傳遞到另一個文件

JavaScript

胡說叔叔 2023-06-09 14:53:26

在下面的代碼中，我想將名稱從 Person.js 傳遞給 App.js 作為 prop。但我不明白該怎么做。如果可以，請解釋一下該怎么做。應用程序.jsimport { useState,useEffect } from 'react';// import Person from './Person'function App(props) { const [greet, setGreeet] = useState(""); return ( <div className="App"> <h1> Good {greet} </h1> </div> );}export default App;Person.jsimport React from 'react';import App from './App'export default function Person (){ const name="Jenifer" return( <div></div> );}

查看完整描述

3 回答

鴻蒙傳說

TA貢獻1865條經驗獲得超7個贊

我認為您是在詢問如何將數據從孩子傳遞給父母。

您必須將一個方法從 App 傳遞給 Person。

并從 Person 組件調用該方法。

function Person (props){

? const {setNameToApp} = props;

? const name = "Jennifer";?

// this useEffect is called when the component mounts for the first time

?React.useEffect(()=>{

? ?setNameToApp(name);

?},[])

// I have also shown how to use button to change the greet state in the app.

? return (

<div>

?<button onClick={()=>{setNameToApp("name when I pressbutton")}}> Set Name </button>?

</div>)

}

function App(props) {

? const [greet, setGreet] = React.useState("");

// pass setGreet function to components which can call this and change the state of the greet

? return (

? ? <div>

? ? ? <h1> Good? {greet} </h1>

? ? ? <Person? setNameToApp = {setGreet} />?

? ? </div>

? );

}

反對回復 2023-06-09

米脂

TA貢獻1836條經驗獲得超3個贊

將名稱作為道具從 person.js（父組件）傳遞到 App.js（子組件）

Person.js

import React from 'react';

import App from './App'

export default function Person (){

? ? const name="Jenifer"

? ? return(

? ? ? ? <div>

? ? ? ? <App name={name}/>

? ? ? ? </div>

? ? );

}

應用程序.js

import { useState,useEffect } from 'react';

// import Person from './Person'

function App(props) {

const [greet, setGreeet] = useState("");

? return (

? ? <div className="App">

? ? ? <h1> Good Morning {props.name} </h1> // Good Morning Jenifer

? ? </div>

? );

}

export default App;

反對回復 2023-06-09

慕桂英546537

TA貢獻1848條經驗獲得超10個贊

最后我找到了原因。發生這種情況是因為我試圖將數據從我的子類傳遞到父類。這樣做是不可能的。

反對回復 2023-06-09

3 回答
0 關注
213 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

將 React 中的道具從一個文件傳遞到另一個文件

將 React 中的道具從一個文件傳遞到另一個文件

3 回答

添加回答