W3Cschool
恭喜您成為首批注冊(cè)用戶
獲得88經(jīng)驗(yàn)值獎(jiǎng)勵(lì)
表單( Form )提供多種方法來執(zhí)行帶有表單字段的動(dòng)作。
表單( Form )可調(diào)用validate
方法以檢查表單是否有效。
名稱 | 數(shù)據(jù)類型 | 作用描述 | 默認(rèn)值 |
---|---|---|---|
model | Object | 表單數(shù)據(jù)。 | null |
rules | Object | 驗(yàn)證規(guī)則。 | null |
delay | number | 延遲驗(yàn)證上次輸入值。 | 200 |
rules
屬性代碼示例:rules: {
name: ["required", "length[5,10]"],
email: "email",
hero: "required",
addr: {
"required":true,
"myrule":{
"validator": (value) => {
if (...){
return true;
} else {
return Promise(resolve => {
//...
resolve(true);
});
}
},
"message": "my error message."
}
}
}
名稱 | 參數(shù) | 作用描述 |
---|---|---|
onValidate | errors | 驗(yàn)證字段時(shí)觸發(fā)。 |
onChange | name,value | 驗(yàn)證字段時(shí)觸發(fā)。 |
onSubmit | event | 提交表單時(shí)觸發(fā)。 |
名稱 | 參數(shù) | 返回值 | 作用描述 |
---|---|---|---|
validate | none | void | 驗(yàn)證所有表單規(guī)則。 |
validateField | name | void | 驗(yàn)證指定字段的規(guī)則。 |
注:
- 繼承: LocaleBase 。
<Form model={user} onChange={this.handleChange.bind(this)}>
<div style={{ marginBottom: '20px' }}>
<Label htmlFor="name" align="top">Name:</Label>
<TextBox inputId="name" name="name" value={user.name}></TextBox>
</div>
<div style={{ marginBottom: '20px' }}>
<Label htmlFor="email" align="top">Email:</Label>
<TextBox inputId="email" name="email" value={user.email}></TextBox>
</div>
<div style={{ marginBottom: '20px' }}>
<Label htmlFor="hero" align="top">Select a hero:</Label>
<ComboBox inputId="hero" data={heroes} name="hero" value={user.hero}></ComboBox>
</div>
<div style={{ marginBottom: '20px' }}>
<CheckBox inputId="accept" name="accept" checked={user.accept}></CheckBox>
<Label htmlFor="accept" style={{width:100}}>Accept Me</Label>
</div>
<div style={{ marginBottom: '20px' }}>
<LinkButton onClick={this.handleSubmit.bind(this)}>Submit</LinkButton>
</div>
</Form>
Copyright©2021 w3cschool編程獅|閩ICP備15016281號(hào)-3|閩公網(wǎng)安備35020302033924號(hào)
違法和不良信息舉報(bào)電話:173-0602-2364|舉報(bào)郵箱:jubao@eeedong.com
掃描二維碼
下載編程獅App
編程獅公眾號(hào)
聯(lián)系方式:
更多建議: