Git Product home page Git Product logo

Comments (1)

gaeundev avatar gaeundev commented on July 18, 2024

I also had a hard time with this problem, and I solved it using path!

<SortableTree
   {...props}
   getNodeKey={({ node }) => node.id.toString()}
   onVisibilityToggle={(args) => {
       const { matches } = find({
           treeData: treeData,
           getNodeKey: (data) => data.node.id.toString(),
           searchMethod: (data: SearchData<DataListItemT>) => {
              return data.path.includes(args.node.id.toString());
        }});
        
        if (matches.length > 0) {
              for (const match of matches) {
                 match.node.expanded = args.expanded;
                
                 setTreeData((prev) => {
                     const changeNode = changeNodeAtPath<DataListItemT>({
                         treeData: prev,
                         path: match.path,
                         getNodeKey: (data) => data.node.id.toString(),
                         newNode: { ...match.node },
                     });
                     
                     return changeNode;
                  });
              }
        }
   }}
/>

Because your tree nodes have duplicate ids,
The question and the function of searchMethod may be different, but I think you can easily solve the problem by using path!

hope this helps

from react-sortable-tree.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.