Приветствую. Подскажите, пожалуйста, как делать управляемыми чекбоксы в множественном случае?

Question

Приветствую. Подскажите, пожалуйста, как делать управляемыми чекбоксы в множественном случае?

Допустим, если один, или два чекбокса, можно создать для них useState и контролировать значения. Но когда их может быть больше 10, что используете?

#frontend #javascript #programming #react.js #russian

0

19.05.2022

13 ответов

17 просмотров

Sarevok

Объект в состоянии типа const [checkedList, setCheckedList] = useState({ 1: true, 2: true, 3: false, ... }) так поиск по объекту O(n) === 1, если же массив использовать, то O(n) === n будет, хотя тут может и не важно если мало чекбоксов. Но я по привычке всегда в приоритете объекты, а массивы только в случаях когда важна последовательность элементов.

0

19.05.2022

Raman

Sarevok
Объект в состоянии типа const [checkedList, set...

Смотря как и что искать

0

19.05.2022

Sarevok

Raman
Смотря как и что искать

Ну массив то мы по объекту всегда можем получить через Object.keys Да и const todoIdList = [1,2,3,4]; const todoData = { 1: {title:"title1"}, 2: {title: "title2"}, 3: {title: "title2"} } удобнее чем const [ {title:"title1", id: 1}, {title:"title1", id: 2}, {title:"title1", id: 3}, ]

0

19.05.2022

Raman

Тем что это каждый раз(не нужный) условный обход по массиву, это ведь не магия всё

0

19.05.2022

Sarevok

Raman
Тем что это каждый раз(не нужный) условный обход п...

Эмм... Какой такой обход по массиву? Нет никакого массива. есть объект с данными. если важно положение элементов то делаеться второй массив с индексами типа const todoListId = [1,2,3,4]; если объект. как для задачи с checkedBox не надо по индексам обходить, то зачем вообще массив? Он же другие данные для отрисовки checkedBox использует, а это просто для хранения "отмечено или нет"

0

19.05.2022

Raman

Sarevok
Эмм... Какой такой обход по массиву? Нет никаког...

Как это const todoIdList = [1,2,3,4]; const todoData = { 1: {title:"title1"}, 2: {title: "title2"}, 3: {title: "title2"} } Будет рендерится ?

0

19.05.2022

Sarevok

todoIdList.map (todoId=><div key={todoId}>{todoData[todoid].title} </div>)

0

19.05.2022

Raman

Sarevok
todoIdList.map (todoId=><div key={todoId}>{todoDat...

То есть вам надо держать 2 структуры up to date правильно? Если генерить из одной другую то это будет обход все равно. И тут мы имеет O(n) - проход и O(1) для получения данных из поля объекта, но нам не надо думать про как держать 2 структуры up to date независимо, ведь если мы будем ее генерировать то это уже ещё один обход

0

19.05.2022

Raman

Ну и не буду :) Это всё разбивается об или держать структуру в ручную up to date, что нереально может быть или генерировать todoIdList но тогда это доп затраты.

0

19.05.2022

Sarevok

Raman
Ну и не буду :) Это всё разбивается об или держат...

Я не пойму, зачем ты все время про генерацию todoIdList говоришь? Я про то что, если важен порядок вывода, то сразу делается вторая структура в виде массива А если нам не надо выводить объект, а только получать из него вложенные объекты по их ИД, то объект гораздо выгоднее. Очевидно, что если нам нужны обе эти операции, то две описанные мной структуры, гараздо выгоднее, чем одна общая.

0

19.05.2022

Raman

Sarevok
Я не пойму, зачем ты все время про генерацию todoI...

К тому что, он должны быть сделано уже до того как мы проходимся, а это надо сделать или руками(что не очень) или сгенирировать(а это уже ещё проход)

0

19.05.2022

Sarevok

Raman
К тому что, он должны быть сделано уже до того как...

Ну ок. Я не скажу. что до конца понимаю твоего беспокойства, но пусть будет по твоему. Лично я такой подход довольно часто пользую и какого-то усложнения кода не заметил. Но возможно это не так. Все может быть.

0

19.05.2022

eden lane · Accepted Answer

eden lane

похоже на форму, а для формы лучше использовать библиотеки для управлением формами

0

19.05.2022

169 похожих чатов

Приветствую. Подскажите, пожалуйста, как делать управляемыми чекбоксы в множественном случае?

13 ответов

Похожие вопросы