將數據從組件傳遞到另一個反應

Question

我有一份問卷並發送請求以從數據庫中取回與答案匹配的所有數據。 然后我想使用另一個組件中的數據來顯示結果。

 <div className='row justify-content-end mt-3 pb-5'>
   <div className='btn btn-primary btn-block rounded shadow-sm result' onClick=this.getSelectedOptions}>Ergebnisanalyse</div>
</div>

我的 onClick 觸發了一個名為“ImpactAnalysis”的類組件中的函數，在其中我將結果作為對象數組返回。 然后我想在類組件“ResultPage”中顯示結果

Answer 1

你可以這樣通過：

<ResultPage data={impactAnalysisResults} />

然后，您將在 ResultPage 組件上擁有此數組。

const ResultPage = ({data}) => {
    const { impactAnalysisResults } = data;
}

Answer 2

只需將這些數據作為道具發送到組件中。 向組件發送道具添加鍵名和配對值。 例如

<ResultPage data={impactAnalysisResults} />

從 ResultPage 捕獲值，例如

function ResultPage ({data}) {
    console.log(data) //check data object sent from parent component
    return (
    //show your data from 'data' props
    <div>{data}</div>
   )
}