Page 1 of 1

input组件BUG,受控写法不生效

Posted: 2025年 Nov 12日 10:37
by mark

ray-js/ray 1.7.23

import {
stringToByte,
} from '@ray-js/robot-protocol';
import {
Input
} from '@ray-js/ray';
const [roomName, setRoomName] = useState('');
const handleChangeText = e => {
const { value } = e;
if (stringToByte(value).length > 19) return;
setRoomName(value);
};
<Input
value={roomName} //输入超出19个字节后,仍然会显示后续的输入内容
onInput={handleChangeText}
/>


Re: input组件BUG,受控写法不生效

Posted: 2025年 Nov 13日 10:05
by lshinylee

你好,你的反馈已收到,我们将尽快答复你。


Re: input组件BUG,受控写法不生效

Posted: 2025年 Nov 14日 18:42
by tangxue.li@tuya.com

小程序 input 并不是完全受控组件。输入时原生 input 会优先更新内部状态,然后才触发 onInput。
因此只在 onInput 中直接 return 不能阻止内部状态变化,必须用受控回写(setState)把合法的值重新写回 input,才能真正限制输入。但是截断后的值可能和当前value相同,setRoomName的时候不会触发视图层的更新,你可以尝试给input加个key值强制重建试试