Android dynamic rendering not updating

I am using react-native-svg-charts and I am seeing new behavior since updating this library. Suddenly when rendering children of the overall SVG component dynamically, they do not update regularly on Android though they do have predictable results.

For instance, with new props they will redraw, but if they are replaced with null or another invisible element with the same key they will not. The only way I’ve been able to get an update is to force it with a dynamic key on the container of the entire SVG element which causes a bad flash to occur when redrawing.

Versions:

• react-native: 0.57.4
• react: 16.6.0-alpha.8af6728
• react-native-svg: ^8.0.8

For the current chart implementation of the SVG component I’m using refer here: https://github.com/alburdette619/react-native-svg-charts/blob/dev/src/chart/chart-grouped.js#L105

Then I am using that and attempting to dynamically render children using standard JSX syntax:

<LineChart...>
  {condition ? <Child/> : null}
</LineChart>

I’ve tried setting keys on the Child, setting dynamic keys to force an update, but the only thing that works is setting a dynamic key on LineChart which is the overall container for the SVG element.

[msand]

Please provide a full replication if you want progress on this

[mgonzalezs]

@msand The change https://github.com/react-native-community/react-native-svg/issues/853#issuecomment-445502539 didn’t work.

<LineChart...  key={chartKey}>
  {condition ? <Child key={childKey}/> : null}
</LineChart>

If I change childKey also the child won’t re-render. If I change chartKey will re-render all the graph but this makes the graph blinks.