Popper Component在选择元素时滚动到顶部

Question

我使用材质UI控件-自动完成。

在这里，我使用了多重选择。

我有下面的代码参考这个答案

<Autocomplete
PopperComponent={PopperMy}
...  
/>
const PopperMy = function (props) {
return <Popper {...props} style={{width: "fit-content"}} placement="bottom-start" />;
};

我面临的问题-

当我滚动并从Popper中选择任何选项时，滚动会自动移动到顶部。

我尝试添加position:"fixed"，但不能阻止在选择选项时自动滚动到顶部。

Answer 1

我已经在useCallback中包装了自定义popper，现在它可以工作了，所以你可以尝试这个

Answer 2

import React, {memo} from "react";
import {Popper, PopperProps} from "@material-ui/core";
const CustomPopper = (props: PopperProps) => {
return (
<Popper
{...props}
style={{
minWidth: 203,
maxWidth: 400,
}}
placement="bottom-start"
/>
);
};
export default memo(CustomPopper)

然后:

<Autocomplete
PopperComponent={PopperMy}
...  
/>