2 回答

TA貢獻1817條經(jīng)驗 獲得超6個贊
您必須使用onChange
event 并從event.target
.
你有例子:
function App() {
function handleExchange(e) {
console.log(e.target.value);
}
return (
<div>
<input className="input-r" placeholder="Type here" onChange={handleExchange} />
{/*or*/}
{/* onKeyPress={handleExchange(event) */}
</div>
)
}
ReactDOM.render(<App />, document.getElementById("root"))
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id="root"></div>

TA貢獻1794條經(jīng)驗 獲得超8個贊
onChange向input元素添加處理程序。注意:處理程序傳遞 ,event因此您需要從事件目標中獲取值。在這里,我使用了destructuring。
function App() {
function handleExchange(e) {
const { target: { value } } = e;
console.log(value)
}
return (
<input
className="input-r"
placeholder="Type here"
onChange={handleExchange}
/>
);
}
ReactDOM.render(<App /> , document.getElementById('root'));
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>
<div id="root"></div>
添加回答
舉報