#javascript #reactjs #material-ui
Вопрос:
Я не совсем уверен, что происходит, потому что в документах пользовательского интерфейса Material это кажется довольно простым, но я не могу включить или выключить флажок после создания компонента.
const createCheckBox = (row, checkBoxStatus, changeStatus) =gt; { let text = ""; if (row.values.map((value, index) =gt; { text = value.title })) if (text) { return ( lt;Checkbox checked /gt; ) } else { return ( lt;Checkbox checked={false} disabled /gt; ) } } Я создаю новые флажки для заданного количества строк. Каждая строка имеет текстовое значение, и там есть текст, я хочу иметь возможность включать или выключать флажок строки, но если текста нет, я хочу, чтобы поле было отключено и не было отмечено.
Странно то, что если я удалю checked из истинной части кода, я смогу установить флажок, но не смогу, когда я его установлю.
Комментарии:
1. Вы получаете какие-либо ошибки? Если да, добавьте их сюда. Попробуйте проверить длину текста в вашем заявлении if.
if(text.length gt; 0)2. @SebastianGbudje без ошибок. У меня в данный момент текст жестко закодирован, поэтому я знаю, каковы значения. Там нет нулевых значений или пустых строк в
text3.
checkedявляется правдивой опорой, поэтому флажок «застрял» установлен иchecked={false}делает его «застрявшим» непроверенным. Ничто не поддается переключению. Почему вы устанавливаете 2 флажка и условно устанавливаете один или другой?4. @DrewReese, это имеет смысл. В основном я пытаюсь отобразить только 1 флажок, но они должны отображаться на основе того, имеет ли текст значение или нет.
5. И
checked={!!text}что ?
Ответ №1:
Я не знаю почему, но после того, как я задаю эти вопросы, я обычно могу понять это сам, задав их.
Вот что у меня есть.
Я поставил этому истинное условие
lt;Checkbox defaultChecked /gt; Но потом это дало мне эту ошибку.
MUI: Компонент изменяет проверенное по умолчанию состояние неконтролируемой базы коммутаторов после инициализации. Чтобы подавить это предупреждение, выберите управляемую коммутационную базу.
Только для того, чтобы он давал, поэтому я поменял флажок на этот.
lt;Checkbox value={row.name "_checkbox"} defaultChecked /gt; Затем это дало мне некоторую ошибку о том, что у меня нет ключа, поэтому я добавил ключ в флажок
lt;Checkbox key={row.name "_checkbox_key"} value={row.name "_checkbox"} defaultChecked /gt; Теперь все работает так, как я хотел.