title: Unable to get proper node and edge data in a react antv/g6 application
body: <p>I'm trying to load data from the redux store into a <code>react</code>, <code>Antv/G6</code> application. But the returned data differs in its edge and node properties. For instance, an edge element when fetched from the redux store is like</p>
  <pre><code>{source: '0', target: '1', label: 'e0-1', weight: 1}
  </code></pre>
  <p>and when it's fetched directly without using redux is</p>
  <pre><code>{source: '0', target: '1', label: 'e0-1', weight: 1, id: 'edge-0.32391998111904051663832636010', …}
  </code></pre>
  <p>The method to fetch data from the <code>exampleSlice.ts</code> slice is</p>
  <pre><code>export const fetchExampleData = createAsyncThunk(
    &quot;example/fetchExampleData&quot;,
    async () =&gt; {
      const response = await fetch(&quot;https://gw.alipayobjects.com/os/basement_prod/6cae02ab-4c29-44b2-b1fd-4005688febcb.json&quot;);
      const data = await response.json();
      return data;
    }
  </code></pre>
  <p>Inside the component, the data getter hook <code>useAppSelector</code> returns the data</p>
  <pre><code>const data = useAppSelector((state) =&gt; state.example.data);
  </code></pre>
  <p>The data had required properties when I tried to load the data <code>locally</code> or when fetched directly inside the <code>useEffect</code> hook inside the component. But when fetched from the redux store it's an undesired result. What I'm doing wrong? Any help or suggestion would be beneficial.</p>