react-sortable-tree not working on react 17.0.1

Viewed 3016

I'm using the example of react-sortable-tree but it's not working on react 17.0.1.

When I'm using react 16.14.0, it has no error and working fine.

List of Errors:

  • Unable to find node on an unmounted component. at findHostInstanceWithWarning
  • Uncaught TypeError: this.clearMonitorSubscription is not a function at ScrollingComponent.componentWillUnmount
  • The above error occurred in the <Scrolling(List)> component:
import React from 'react'
import 'react-sortable-tree/style.css'
import SortableTree from 'react-sortable-tree'
class Areas extends React.Component {
  constructor(props) {
    super(props)

    this.state = {
      treeData: [
        { title: 'Chicken', children: [{ title: 'Egg' }] },
        { title: 'Fish', children: [{ title: 'fingerline' }] }
      ]
    }
  }

  render() {
    return (
      <div style={{ height: 400 }}>
        <SortableTree
          treeData={this.state.treeData}
          onChange={treeData => this.setState({ treeData })}
        />
      </div>
    )
  }
}
1 Answers

For me setting isVirtualized property of SortableTree component to false as a temporary solution worked out (link). Warning: it disables auto-scrolling while dragging, and scrolling to the searchFocusOffset.

Also there is a solution using patch-package https://github.com/frontend-collective/react-sortable-tree/issues/821#issuecomment-766860082

Corresponding issue: https://github.com/frontend-collective/react-sortable-tree/issues/821

PR to watch: https://github.com/frontend-collective/frontend-collective-react-dnd-scrollzone/pull/80

Related