MUI 自动完成 - 默认选中所有选项

Question

我一直在使用这个例子来尝试让自动完成下拉列表中的值在默认情况下自动选择。 我希望在加载页面时选择所有值。 有谁知道如何做到这一点？

沙盒代码： https : //codesandbox.io/s/s26gz? file =/ demo.js: 504-523

Answer 1

您可以控制value的的Autocomplete通过覆盖value / onChange道具和使用useState设置最初选择的选项：

const [value, setValue] = React.useState(options);

return (
  <Autocomplete
    options={options}
    value={value}
    onChange={(e, v) => setValue(v)}
    {...}
  />
);

或者，如果您使用的是不受控制的模式，只需传递一个defaultValue ：

<Autocomplete
  defaultValue={options}
  {...}
/>

Answer 2

您可以像这样将defaultValue道具传递给 Autocomplete

  <Autocomplete
    options={options}
    value={value}
    defaultValue={top100Films}
    ...
  />