react-sortable-tree not working on react 17.0.1
See original GitHub issueI’m using the example of react-sortable-tree but it’s not working on react 17.
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>
)
}
}
Issue Analytics
- State:
- Created 3 years ago
- Reactions:32
- Comments:5
Top Results From Across the Web
react-sortable-tree not working on react 17.0.1 - Stack Overflow
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....
Read more >react-sortable-tree-patch-react-17 - npm
Drag-and-drop sortable component for nested data and hierarchies. Latest version: 2.9.0, last published: 2 years ago.
Read more >React-sortable-tree - npm.io
A React component for Drag-and-drop sortable representation of hierarchical data. Checkout the Storybook for a demonstration of some basic and advanced features ...
Read more >react-sortable-tree-demo - StackBlitz
import 'react-sortable-tree/style.css';. import './style.css';. import SortableTree from. 'react-sortable-tree';. export default function App() {.
Read more >react-sortable-tree-patch-react-17 examples - CodeSandbox
React Sortable Tree Patch React 17 Examples. Learn how to use react-sortable-tree-patch-react-17 by viewing and forking example apps that make use of ...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Hi guys,
I fixed the issues with React 17 and created a separate package.
You can install it using
But it does not include types for typescript. you can workaround with it:
decs.d.ts
file and place it withtsconfig.json
declare module @nosferatu500/react-sortable-tree
todecs.d.ts
filetsconfig.json
changeto
I am not planning any new features or any other updates (only bug fixes and only if it block my own work), but if you want to improve something, you can send me the PR to me https://github.com/nosferatu500/react-sortable-tree and I will merge it.
Actually, it’s not a good solution. We need to communicate with the authors of the
react-sortable-tree
to fix it in the original version.