[英]Material-UI: How to get the value in Slider?
我正在使用 Material-UI Slider ,我想通过onChange
function 获取值。
我的代码是这样的:
const SliderScale: React.FC = () => {
const classes = useStyles();
const [inputValue, setInputValue] = useState(0);
const updateRange = (value: number) : void => {
setInputValue(value);
};
return (
<div className={classes.root}>
<Typography id="discrete-slider" gutterBottom>
value
</Typography>
<Slider
defaultValue={0}
value={inputValue}
getAriaValueText={valuetext}
aria-labelledby="discrete-slider"
valueLabelDisplay="on"
step={0.5}
marks={false}
min={0}
max={10}
onChange={updateRange}
/>
</div>
);
};
export default SliderScale;
这不起作用并显示此错误。
(JSX 属性) onChange?: ((event: React.ChangeEvent<{}>, value: number | number[]) => void) | undefined 没有重载匹配这个调用。 重载 1 of 2, '(props: { component: ElementType; } & { 'aria-label'?: string | undefined; 'aria-labelledby'?: string | undefined; 'aria-valuetext'?: string | undefined; color?: "primary" | "secondary" | undefined; ... 18 个以上...; valueLabelFormat?: string |... 1 个以上... | undefined; } & CommonProps<...> & Pick<. ..>): Element',给出了以下错误。 类型 '(value: number) => void' 不可分配给类型 '(event: ChangeEvent<{}>, value: number | number[]) => void'。 参数 'value' 和 'event' 的类型不兼容。 类型 'ChangeEvent<{}>' 不可分配给类型 'number'。 重载 2 of 2,'(props: DefaultComponentProps<SliderTypeMap<{}, "span">>): Element',给出了以下错误。
有谁知道如何得到它?
文档中的onChange
签名是:
function(event: object, value: number | number[]) => void
新值在第二个参数中,而不是onChange
回调的第一个。 将您的代码更改为:
<Slider {...props} onChange={(_, value) => setInputValue(value)} />
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.