如何在 reactjs 中将状态传递给 LinearStepper?

Question

这是我的构造函数，我的变量在哪里，我想要的只是在水平线性步进器中传递这个变量......

export class Dashboard extends React.Component {
constructor(props) {
super(props);
this.state = {
area: null,
};
}

我成功获取值并将其设置为 this.state.area

var Area = L.GeometryUtil.geodesicArea(layer.getLatLngs()[0]);
var area1 = L.GeometryUtil.formattedNumber(Area * 0.001) + "  m²";
console.log(area1);
this.setState({
area: area1,
});

这就是我在步骤 1 中给我的组件仪表板的方式

case 1:
return (
<div style={{ padding: "2% 0" }}>
<Typography variant="h4">Find your land on the map</Typography>
<AlertNoPoly errorStatusPolly={errorStatusPolly} />
<ul>
<li>
Find your land on the map and mark it using the map tools.
</li>
<li>Or upload a digital file of your land</li>
</ul>
<Dashboard viewMap={viewMap}  area={area} />
</div>
);

现在我的问题是，从步进器到仪表板传递变量及其值没有问题，但是如何从仪表板到步进器传递变量？

Answer 1

如果我正确理解了您的问题 - 这是一个将值从父级传递到子级的示例

const Stepper = props => {
const childValueHandler = (childValue) => {
// do what you want with childValue
}
return <Dashboard childValueHandler={childValueHandler} />
}

所以在Dashboard里面你只需调用props.childValueHandler传递值作为参数