При расширении компонента Автозаполнение пользовательского интерфейса открывается раскрывающийся список, как и ожидалось. Однако, как только он открывается и я прокручиваю его, он перемещается, а не остается под окном автозаполнения. Я обнаружил, что это поведение должно быть исправлено для версии материала, которую я использую , как указано здесь . Я также проверил это для простого нового проекта в песочнице, где он работал нормально.
Поэтому я ожидаю, что невольно перезаписал некоторые важные настройки стиля, но не смог понять ошибку. Любые идеи, где я мог бы искать?
Следуя соответствующему фрагменту кода:
The component where I render the Autocomplete component
const useStyles = makeStyles(theme => ({
...,
vinBox: {
width: 320,
marginTop: "4px"
}
}));
...
return (
<Autocomplete
id="vin-selection"
options={allVehicleVins}
className={classes.vinBox}
onChange={(event, data) => setFilter({ ...filter, vin: data })}
value={filter.vin}
renderInput={params => (
<TextField
{...params}
margin={"normal"}
label="VIN"
variant="standard"
InputProps={{
...params.InputProps,
startAdornment: (
<InputAdornment position="start">
<DirectionsCar />
</InputAdornment>
)
}}
helperText={
"Choose a VIN to filter for specific vehicles of your fleet."
}
fullWidth
/>
)}
/>
);
};
Я использовал Chrome Версия 80.0.3987.149 (хотя это также произошло в других браузерах). Некоторые из моих зависимостей:
...
"@material-ui/core": "^4.8.2",
"@material-ui/icons": "^4.5.1",
"@material-ui/lab": "^4.0.0-alpha.35",
"react": "^16.12.0",
...