Question

我有一个受控的自动完成组件，该组件绑定到redux的状态道具，一切正常。当用户单击“清除”图标时，会触发onChange事件，但是输入会集中显示，并且下拉菜单会在发生这种情况时打开。

如何仅在清除所选选项后才能阻止输入焦点/下拉菜单打开？我的首选行为是返回到选择“空”并显示未收缩标签。

代码大致如下所示。 value来自mapStateToProps，onChange来自mapDispatchToProps。

const LetterSelect: FC<Props> = ({ value, onChange }: Props) => {
    return (
        <Autocomplete
            options={["A", "B", "C", "D"]}
            value={value ?? null}
            onChange={(e,v) => onChange(v)}
            renderInput={params => (
                <TextField {...params} label="Letter" variant="outlined" fullWidth />
            )}
        />
    )
}

Answer 1

对不起，我没有早点回到这个问题：实际上并没有直接的解决方法。

相反，我在Github上打开了一个问题，并同意更改默认行为-请参阅this PR。

单击“清除”图标不再从v4.8.1开始打开自动完成功能

如何自定义Material-UI自动完成的明确行为？

1 个答案: