6. 表单数据绑定

This commit is contained in:
shikong 2024-10-25 20:55:40 +08:00
parent 1cbf245a2f
commit 221d5573d4
Signed by: Shikong
GPG Key ID: BD85FF18B373C341

View File

@ -3,7 +3,7 @@ import {useEffect, useState} from "react";
export default function InputComponent() {
const [state, setState] = useState({
inputValue: "666",
checkedArr: []
checkedArr: ["1","3"]
})
function onChecked(e) {
@ -40,9 +40,9 @@ export default function InputComponent() {
value={state.inputValue}/>
<div>
<input value={1} onChange={onChecked} type="checkbox" name="options"/> 选项1
<input value={2} onChange={onChecked} type="checkbox" name="options"/> 选项2
<input value={3} onChange={onChecked} type="checkbox" name="options"/> 选项3
<input checked={state.checkedArr.indexOf("1") !== -1} value="1" onChange={onChecked} type="checkbox" name="options"/> 选项1
<input checked={state.checkedArr.indexOf("2") !== -1} value="2" onChange={onChecked} type="checkbox" name="options"/> 选项2
<input checked={state.checkedArr.indexOf("3") !== -1} value="3" onChange={onChecked} type="checkbox" name="options"/> 选项3
</div>
</div>
}