當我使用Switch組件時，我在瀏覽器控制臺收到了這個錯誤。
...
import { Button, Form, FormText, Label, Input } from 'reactstrap'/span>;
import { FormGroup, Switch, Radio, FormControlLabel, RadioGroup } from '@material-ui/core'。
...
//state variable to keep my Switch values. 我從資料庫中抓取這些值。
const [ companySettings, setCompanySettings ] = useState（{}）。
...
//我在哪里渲染開關Form inline>
<div className="row">/span>
<div className="col-sm-12"/span>>
<FormGroup row>
<Switch name="escrow" checked={companySettings. payCCFee} onChange={() => setCompanySettings({...companySettings, payCCFee: !companySettings.payCCFee})} aria-label="公司支付CC費用" />
< Label for="escrow" className="mr-sm-10" >
公司支付信用卡便利費？
</Label>
</FormGroup>/span>
</div>
</div>/span>
</Form>
當我點擊開關時，瀏覽器控制臺顯示：
Material-UI。一個組件正在改變不受控制的檢查狀態的SwitchBase被控制。
元素不應該切換 從不受控到受控（或相反）。
決定使用受控或不受控的SwitchBase元素用于組件的壽命的。
的性質的狀態是在第一次渲染時確定的，它的值如果不是`undefined`就被認為是受控的。
uj5u.com熱心網友回復：
這個問題是由于狀態物件companySettings被初始化為一個空物件。在開關組件的checked={companySettings.payCCFee}中這樣做，會回傳未定義的結果，而且react認為這是一個不受控制的組件，因為沒有提供值。你可以初始化狀態物件，使其具有一些默認值，就像下面這樣
const [ companySettings, setCompanySettings ] = useState({payCCFee: false}); //基于用戶體驗的true。
第二種方案是你初始化了空狀態，但使用雙重否定運算子將undefined轉換為false。
checked={!!companySettings.payCCFee}。
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/322747.html
標籤：
上一篇：ExpoReact警告。不能在一個未掛載的組件上執行React狀態更新。這是一個無用功，但它表明你的應用程式中存在記憶體泄漏。