小编Igo*_*r K的帖子

当使用 useState 钩子设置 onChange 时,RadioGroup 将不会选择

我有一个工作得非常好的 RadioGroup。当我将 RadioGroup 移动到它自己的函数中时,“选择”不起作用。就好像组件无法完全重新渲染一样。当我附加onChange使用状态挂钩的事件时会发生这种情况。您可以在这里看到,无线电 1 和 2 运行良好。无线电 3 和 4 没有。

CodeSandbox 材质 UI RadioBox 示例

这是我正在使用的组件。未包装到函数中的 RadioGroup 效果很好。那就是——它不“选择”。意味着黑点不会出现在选择单选按钮中。

function Demo(props) {
  const [inputs, setInputs] = useState({});

  const handleInputChange = event => {
    event.persist();
    setInputs(inputs => ({
      ...inputs,
      [event.target.name]: event.target.value
    }));

    console.debug(`${event.target.name}: ${event.target.value}`);
  };

  const NotWorking = props => {
    return (
      <RadioGroup aria-label="two" name="two" row onChange={handleInputChange}>
        <FormControlLabel
          value="3"
          control={<Radio color="primary" />}
          label="3"
          labelPlacement="end"
        />
        <FormControlLabel
          value="4"
          control={<Radio />}
          label="4"
          labelPlacement="end"
        />
      </RadioGroup>
    );
  };

  return ( …
Run Code Online (Sandbox Code Playgroud)

reactjs material-ui

1
推荐指数
1
解决办法
5897
查看次数

标签 统计

material-ui ×1

reactjs ×1