0

抱歉，这看起来像是重复的，但我找不到可以为我指明正确方向的答案。

以下是我认为相关的部分代码。抱歉，如果我错过了任何内容。

function Packages(){
    const [height, setHeight] = useState(0);
    const [width, setWidth] = useState(0);
    const [depth, setDepth] = useState(0);
    const [maxWeight, setMaxWeight] = useState(0);
    const [packageName, setPackageName] = useState('');
    const [packageId, setPackageId] = useState(null);
    const toggleActive = useCallback(() => setActive((active) => !active), []);



    function loadEdit(index){
        toggleActive();
        let packageInfo = packages[index];
        setHeight(packageInfo.height);
        console.log('height', height);
        setWidth(packageInfo.width);
        setDepth(packageInfo.depth);
        setMaxWeight(packageInfo.maxWeight);
        setPackageName(packageInfo.packageName);
        setPackageId(packageInfo.id);
    }

<div style={{height: '500px'}}>
            <Modal large open={active} onClose={toggleActive} title="Create New Package"
                primaryAction={{
                    content: 'Create',
                    onAction: createNewPackage,
                    loading: btnLoadingState
                }}
                secondaryActions={[
                    {
                        content: 'Cancel',
                        onAction: toggleActive,
                    },
                ]}
            >
                <Modal.Section>
                    <Stack vertical>
                        <TextField label="Package Name" value={packageName} onChange={setPackageName} autoComplete="off" />
                        <TextField label="Height in CM" value={height} onChange={setHeight} autoComplete="off" />
                        <TextField label="Width in CM" type="number" value={width} onChange={setWidth} autoComplete="off" />
                        <TextField label="Depth in CM" type="number" value={depth} onChange={setDepth} autoComplete="off" />
                        <TextField label="Max Weight in Grams" type="number" value={maxWeight} onChange={setMaxWeight} autoComplete="off" />
                    </Stack>
                </Modal.Section>
            </Modal>
        </div>

}
export default Packages;

我的问题：当从代码的另一部分调用 loadEdit 函数时，它应该加载代码中显示的 Modal，并预先设置了文本框。我可以确认 packageInfo 变量已加载相关对象，并且引用的每个属性都存在并具有值。我遇到的问题是，当模式弹出时，只有“packageName”变量有值。如果为空，则其他所有内容。

只有一个变量的值是如何预填充的。我什至将数字硬编码到 setState 方法中。但没有成功。任何帮助是极大的赞赏。

4

0 回答 0