在ReactJS中的两个功能组件之间访问数据

如何解决在ReactJS中的两个功能组件之间访问数据

我想在两个功能组件之间共享一些数据。我有两个组件：Burger.js和Order.js

在burger.js中使用useState（）定义状态，我想将某些值（处于状态中）传递给Order.js。

代码有点像这样：

Burger.js =>

import Order from './components/order.js';

 const [stateValues,setStateValues] = useState({
    salad: 0,chicken: 0,cheese: 0,tomato: 0,});

.
.
.
. /* Code in between */
.
.
<Order orders = {stateValues} />   

.
.
.
.
.

Order.js =>

.
.
.
const Order = (props) => {

return(
    <div ClassName="xyz">

    const {salad,chicken,cheese,tomato} = props.orders;   

// NOT WORKING. Error Showing up: salad,tomato are not defined

    const {salad} = props.orders.salad;    

// THIS IS ALSO NOT WORKING. Error Showing up : 'salad' is not defined

我无法弄清楚通过道具共享数据有什么问题（burger.js和order.js都是功能组件）