Question

我正在使用带有值的选择组件，方法是使用如下所示的 useEffect 设置它们。

useEffect(()=>{
    const {property, properties} = props;
    setProperties(properties); // properties is an array of values 
    ['somevalue1', 'somevalue2']
     setProperty(property)
},[props])

但这会导致出现以下 javascript 警告。我猜这是因为竞争条件首先设置属性而不是属性数组。有什么避免警告的提示吗？

您为选择组件提供了超出范围的值 somevalue1。考虑提供一个与可用选项或 '' 匹配的值。可用值为“”。

下面是我正在使用的选择代码。

<Select
    value={property}
    onChange={onChange}
    input={<BootstrapInput />}
    defaultValue=""
>
    {Object.keys(properties).map((key) => (
        <MenuItem key={key} value={key}>
            {key}
        </MenuItem>
    ))}
</Select>

Answer 1

为什么要在 useEffect 中设置状态值？如果您没有特定原因，请尝试像下面的代码一样修改它。

const [properties, setProperties] = useState(props.properties);
const [preperty, setProperty] useState(props.property)

你问的代码似乎有无限重复的潜力。

材质 UI 选择组件抛出 javascript 控制台警告

1 个答案: