Блог

Я работаю с MUI «множественный выбор» / «множественный выбор флажков».

Моя цель -> Открыть модальное значение, установить некоторое начальное значение, а затем иметь полный контроль над выбором.

Мои проблемы -> В настоящее время начальные элементы могут быть выбраны повторно, и после их выбора их нельзя отменить.

Вот изолированная среда кода, созданная из-за проблемы MUI, связанной с этой проблемой MUI

На данный момент ->Я включил 3 набора состояний в изолированную среду

 newOptions is equal to [options[1]]

1 - value: [options[1]]  -> Success
2 - value: options.slice(0,1)  -> Success
3 - value: newOptions  -> Failure
  

Отключив комментарии к различным состояниям, вы можете увидеть описанное поведение, и элементы не будут удалены из режима множественного выбора.

Мне интересно, может ли кто-нибудь описать это поведение и его решение => хотя я смог добиться некоторого успеха (используя [options[x]]), однако это не поддерживает то, что я делаю в своем проекте.

Как указано в https://github.com/mui-org/material-ui/issues/16775 , Вы можете как бы исправить это, используя ссылку на объект в качестве значения по умолчанию, например https://codesandbox.io/s/create-react-app-vgyz6

Я думаю, что при использовании ссылки на объект компонент выбора по умолчанию использует проверку равенства ссылок, поэтому отмена выбора работает.

Когда вы используете третий способ, «3 — value: newOptions -> Сбой», в Javascript даже свойства и значения 2 объектов идентичны, но сами объекты не считаются равными.

 var jangoFett = {
    occupation: "Bounty Hunter",
    genetics: "superb"
};

var bobaFett = {
    occupation: "Bounty Hunter",
    genetics: "superb"
};

// Outputs: false
console.log(bobaFett === jangoFett);