mercredi 18 août 2021

React switch not switching

I've added a switch to a header of my react table and even when the state clearly changes, the swithc just does not switch, any ideas?

Here's the code:

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>
        ),
      }
    ],
    []
  );

And here's how it looks

The logged bool is the value of consent, I've switched it multiple times and as you can see the state changes but not the switch itself




Aucun commentaire:

Enregistrer un commentaire