Блог

Главная - Вопросы по программированию - Переключатель реакции не переключается

Переключатель реакции не переключается

#reactjs #checkbox #react-table

Вопрос:

Я добавил переключатель в заголовок своей таблицы react, и даже когда состояние явно меняется, swithc просто не переключается, есть идеи?

Вот код:

 function DefaultParametersRowContent({ data, impactFields, onClickHandler, content }: any) {
  console.log(content);
  const columns = React.useMemo(
    () => [
      {
        Header: "",
        accessor: "name",
      },
      {
        Header: "",
        accessor: 'action2',
        type: "switch",
        Cell: (row: { row: { original: any; }; }) => (
          <span >
            <div className='menupolicy__form--switch'>
              <label className='switch'>
                <input
                  type='checkbox'
                  checked={content}
                  onChange={() => onClickHandler()} />
                <span className='switch__slider round'></span>
              </label>
            </div>
          </span>
        ),
      },
      {
        Header: () => null,
        id: 'expander',
        Cell: ({ row }: any) => (
          <span {...row.getToggleRowExpandedProps()}>
            {row.isExpanded ? <FaChevronUp /> : <FaChevronDown />}
          </span>
        ),
      }
    ],
    []
  );

И вот как это выглядит

Зарегистрированный bool-это значение согласия, я переключал его несколько раз, и, как вы можете видеть, меняется состояние, но не сам переключатель

Комментарии:

1. попробуйте удалить useMemo или добавить зависимость в массив useMemo

2. Да!!! вот оно что! Большое тебе спасибо, Раман!

3. Как это мешало коммутатору работать, кстати? Я попытался изменить флажок prop на значение prop, и тогда это сработало, но в процессе отключил вызов api

4. изменение реквизита приводит к повторному отображению компонента, но ваши столбцы остались такими же, как и раньше, из-за useMemo

Метки: