使用React.js的复选框修改字符串中的文本可以通过以下步骤实现:
import React, { useState } from 'react';
function App() {
const [text, setText] = useState('Hello World');
const [isChecked, setIsChecked] = useState(false);
// 复选框改变事件处理函数
const handleCheckboxChange = () => {
setIsChecked(!isChecked);
};
return (
<div>
<input type="checkbox" checked={isChecked} onChange={handleCheckboxChange} />
<input type="text" value={isChecked ? 'Modified Text' : text} onChange={(e) => setText(e.target.value)} />
</div>
);
}
export default App;
通过以上步骤,当复选框选中时,文本输入框中的文本将被修改为"Modified Text",取消选中时,文本输入框将显示原始的文本值。
领取专属 10元无门槛券
手把手带您无忧上云