Antd中的Input输入框在滚动时会导致输入框的值发生改变,这可能是由于虚拟滚动所致。 解决方法是在Input组件中加入一个onBlur事件,这样当输入框失去焦点时就会自动触发,从而可以避免滚动时的值改变问题。以下是示例代码:
import React, { useState } from 'react'; import { Input } from 'antd';
const ScrollableInput = (props) => { const [value, setValue] = useState('');
const onChange = (e) => { setValue(e.target.value); }
const onBlur = (e) => { setValue(e.target.value); }
return ( ); }
export default ScrollableInput;
通过将它封装成一个自定义的ScrollableInput组件,即可避免Antd中Input输入框在滚动时的值改变问题。