如何解决带有 Material UI 滑块和 React 的简单字体大小更改器
我正在尝试制作一个使用 React 和 Material UI 更改字体大小的简单滑块。 滑块称为 PrettoSlider,它是 Material UI 的一部分。
我想要实现的是使用滑块,然后根据滑块更改字体大小。 这是我目前所拥有的
export default function ChangeFontSlider() {
const [ItemValue,setItemValue] = React.useState(20);
const handlingChange = (event) => {
setItemValue(event.target.value);
event.preventDefault();
}
return (
<>
<p style={{fontSize: {ItemValue}}}>Drag me to change the font</p>
<PrettoSlider
onChange={handlingChange}
value={ItemValue}
/>
</>
);
}
尝试滑动滑块时,出现错误或字体保持不变。 任何的想法?谢谢!
解决方法
滑块称为 PrettoSlider,它是 Material UI 的一部分。
PrettoSlider 就是一个例子。下划线组件是此处记录的 Slider https://material-ui.com/api/slider/。
根据文档,onChange函数有2个参数,event
是事件源,第二个参数value
是移动滑块时的新值,需要从中获取数据。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。