react项目，input如何在外部如何修改value值？

Question

如何一个input

<input title="" class="input01" type="text" maxlength="6" placeholder="" pattern="\d{6}" value="" inputMode="numeric">

使用JS操作

document.getElementsByClassName("input01")[0].value = 12345;

此时界面上，input框里12345会一闪而过，经过百度得知react底层可能有一个需要setstate才能通知后台渲染新数据。

请问还有什么办法可以从外部使用JS/JQ给input赋值不会被清空数据的办法吗？

Answer 1

react 项目中，最好把 input 当成受控组件，通过 setState 的方式进行值绑定，如果非要通过 js 绑定值，首先要在合适的生命周期进行原生 DOM 操作，在类组件中 componentDidMount、componentDidUpdate,函数组件中 useEffect