T
TanStack•3y ago
fascinating-indigo

losing focus on rerender

How do I prevent this? https://github.com/TanStack/table/issues/1346 I read these issues and the solutions don't work for me It's important to point out that this only happens if I call setSomeZustandState(value), if I call it with null, I keep the focus This my cell: 
columnHelper.accessor('column', {
      header: 'column',
      cell: () => {
        return (
          <div
            tabIndex={0}
            onKeyDown={(e) => {
              console.log('keydown')
            }}
            onFocus={() => {
              console.log('focus')
            }}
            onClick={(e) => {
                setSomeZustandState(value)
              }
            }}
          >
            test
          </div>
        )
      }
    }),
columnHelper.accessor('column', {
      header: 'column',
      cell: () => {
        return (
          <div
            tabIndex={0}
            onKeyDown={(e) => {
              console.log('keydown')
            }}
            onFocus={() => {
              console.log('focus')
            }}
            onClick={(e) => {
                setSomeZustandState(value)
              }
            }}
          >
            test
          </div>
        )
      }
    }),
GitHub
Lose focus on input in a cell · Issue #1346 · TanStack/table
Describe the bug In version 6.9, we lose focus on input fields in cell on keystroke. To Reproduce Go to this sandbox link to reproduce the behavior https://codesandbox.io/s/reacttable-cell-renderer...
1 Reply
correct-apricot
correct-apricot•2y ago
I'm facing the exact same issue. I have a link in a cell that loses focus if it sets state. If it doesn't, then focus stays on it after the click, which is what i want. Not sure how to prevent that

Did you find this page helpful?