我是 React 新手，正在嘗試呼叫一個充當組件的函式，但回傳兩個值，一個稱為“render”，它只回傳一個包裝在 div 中的組件，另一個稱為 sliderVal，它是一個內部狀態值那個滑塊。下面是來自 MySlider.js 的代碼
function MySlider(props) {
const [sliderVal, setSliderVal] = useState(1);
return{
render:(
<div>
<Grid container justify = "center">
<Box sx={{ width: 250 }}>
<Typography id="input-slider" gutterBottom>
{props}
</Typography>
<Slider
defaultValue={1}
valueLabelDisplay="auto"
step={1}
value={sliderVal}
marks
min={1}
max={10}
onChange={(_, newValue) => setSliderVal(newValue)}
/>
</Box>
</Grid>
</div>
),
sliderVal
}
在我的 App.js 中，我使用以下代碼來呈現兩個滑塊，并將它們的值傳遞給另一個組件。
var {render, sliderVal} = MySlider("Number of Paragraphs");
var {render1, sliderVal1} = MySlider("Number of Words");
第一個效果很好，我可以使用 {render} 來渲染滑塊，并使用 {sliderVal} 來訪問它的值并傳遞給另一個組件。然而，第二個不起作用，沒有任何渲染。當我 console.log render1 和 sliderVal1 時，它們都是未定義的。非常感謝任何見解！
uj5u.com熱心網友回復：
第二次更改為：
var {render:render1, sliderVal:sliderVal1} = MySlider("Number of Words");
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/469001.html
標籤：javascript 反应 反应钩子