我有一堆復選框，如果沒有選擇它們，則需要顯示警告訊息。
像這樣，
唯一的規則是，如果沒有選中任何復選框，則在提交時必須顯示如上的警告訊息，如果選擇了其中任何一個，則不顯示警告。
我的代碼：
<Form.Item
name="checkboxes"
valuePropName="checked"
rules={[
{
required: true,
message: "Please select atleast one working day",
},
]}
>
<Checkbox onChange={this.sun}>Sun</Checkbox>
<Checkbox onChange={this.mon}>Mon</Checkbox>
<Checkbox onChange={this.tue}>Tue</Checkbox>
<Checkbox onChange={this.wed}>Wed</Checkbox>
<Checkbox onChange={this.thu}>Thu</Checkbox>
<Checkbox onChange={this.fri}>Fri</Checkbox>
<Checkbox onChange={this.sat}>Sat</Checkbox>
</Form.Item>
在上面的代碼中，即使單擊任何復選框之一，它也會顯示警告。
所以，我厭倦了改變規則，
rules={[
{
required:
this.state.mon &&
this.state.tue &&
this.state.wed &&
this.state.thu &&
this.state.fri &&
this.state.sat &&
this.state.sun === false,
message: "Please select atleast one working day",
},
但在上述情況下，如果沒有選中任何復選框，它甚至不會顯示任何警告訊息。
我將antd用于 UI，并且復選框是從中匯入的。（參考：https : //ant.design/components/checkbox/）
uj5u.com熱心網友回復：
這個條件，你確定嗎？僅false適用于sun。
this.state.mon &&
this.state.tue &&
this.state.wed &&
this.state.thu &&
this.state.fri &&
this.state.sat &&
this.state.sun === false
您的代碼：“如果選擇了 6 天且星期日為假 - 則顯示錯誤訊息”
我想你需要類似的東西
{
required: ![this.state.mon, this.state.tue, this.state.wed, this.state.thu, this.state.fri, this.state.sat, this.state.sun].some(d => !!d)
}
uj5u.com熱心網友回復：
你Checkbox沒有checked財產。
從 antD檔案：
屬性：選中 描述：指定復選框是否被選中 型別：布林值
因此，將您的狀態變數傳遞給Checkbox組件：
// rest of the codes ...
<Checkbox checked={this.state.sun} onChange={this.sun}>Sun</Checkbox>
<Checkbox checked={this.state.mon} onChange={this.mon}>Mon</Checkbox>
<Checkbox checked={this.state.tue} onChange={this.tue}>Tue</Checkbox>
<Checkbox checked={this.state.wed} onChange={this.wed}>Wed</Checkbox>
<Checkbox checked={this.state.thu} onChange={this.thu}>Thu</Checkbox>
<Checkbox checked={this.state.fri} onChange={this.fri}>Fri</Checkbox>
<Checkbox checked={this.state.sat} onChange={this.sat}>Sat</Checkbox>
// rest of the codes ...
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/344939.html