1

I am developing an application in react in which main screen has 3 split panes, [You can see the layout in this pic][1]. Now When i am adding a new file in testing folder from right side childnode state updates but changes is not rendering. I am using redux for that purpose. Here is my code: Action.js

  return {
    type: "addFolder",
    name: name,
  };
};

export const update = (sceneName, folder) => {
  return {
    type: "addScene",
    sceneName: sceneName,
    folder: folder,
  };
};```
Reducers:(overview)
```import { adds } from "./add";
const allReducer = combineReducers({
  addFolder: adds,```
```import sceneImage from "../static/images/scene.png";
import update from "react-addons-update";

var x = Math.floor(Math.random() * 100 + 1)
let obj = [
  {
    icon: "Geo",
    id: 1,
    name: "Testing",
    nodeChild: [
      { id: 2244, name: "Scene1", image: sceneImage },
      { id: 2244, name: "Scene2", image: sceneImage },
    ],
  },
];
export const adds = (state = obj, action) => {
  switch (action.type) {
    case "addFolder":
      return [
        ...state,
        {
          icon: "GEO",
          id: obj.length,
          name: action.name,
          nodeChild: [],
        },
      ];
    case "addScene":
      const newState = [...state];

      const objIndex = newState.findIndex((obj) => obj.id == action.folder);
      newState[0].nodeChild.push({
        id: 2244,
        name: action.sceneName,
        image: sceneImage,
      });

      return newState; //[...state, newState];

    default:
      return state;
  }
};```

Anyone please help me




  [1]: https://i.stack.imgur.com/NeKUy.png
Salman Zahid
  • 23
  • 4

1 Answers1

1

After spending many hours i found a solution and i am sharing it here so that in future may be it will help others.

So the problem is my redux is updating the state correctly but syncfusion treeview component has an issue i-e it will not show changes unless we render the node again. So for dynamically adding the nodechild in treeview component you have to render the whole node again.

Salman Zahid
  • 23
  • 4
  • please add more information about the solution, it would be external links or live reproducible code from `codesandbox` that would be more clear to someone who is struggling with the same issue – Emad Baqeri Dec 14 '21 at 21:58
  • Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Dec 14 '21 at 21:58