iannbing / react-simple-tree-menu

A simple React tree menu component
MIT License
137 stars 48 forks source link

Is there a way to make ItemComponent active and its parent nodes open at the same time ? #195

Open kk798 opened 3 years ago

kk798 commented 3 years ago

Hi @iannbing, First of all, Thanks for the wonderful library which helped me a lot. But I am facing lil issue with the openNodes prop. let me show you the code. `

Hello CodeSandbox

  <h2>Start editing to see some magic happen!</h2>
  <TreeMenu
    openNodes={["mammal","canidae"]}
    activeKey="mammal/canidae/dog"
    data={dataInArray}
  >
    {({ search, items }) => {
      return (
        <>
          <input onChange={(e) => search(e.target.value)} />
          <ul className="tree-item-group">
            {items.map((props) => {
              const childrenProps = {
                ...props,
                onClick: () => window.open(props.url)
                // style: { color: props.color || "black" }
              };

              return <ItemComponent {...childrenProps} />;
            })}
          </ul>
        </>
      );
    }}
  </TreeMenu>
</div>`

Here, I tried to open all the parent nodes till their children, but it is just opening the first parent let's say mammal. also, I m unable to expand(also click) the rest of the parents till dog.

iannbing commented 3 years ago

I think what you want is probably initialOpenNodes instead of openNodes. openNodes allows you to have direct control of what nodes should be open (meaning that, user cannot freely expand/collapse nodes).

kk798 commented 3 years ago

Yeah, It works. Thanks for making it to my consideration ! @iannbing