Bad cache Component data type behaviour #62
Description
Here is a snippet:
import {JsonViewer} from "@textea/json-viewer";
import * as React from "react";
export function IndexPage() {
const data1 = [{'key': 'val1'}]
const data2 = [{'key': 'val2'}]
return (
<>
<JsonViewer
value={data1}
valueTypes={[
{
is: (() => true) as any,
Component: (props) => {
return <>first viewer</>;
},
},
]}
/>
<JsonViewer
value={data2}
valueTypes={[
{
is: (() => true) as any,
Component: (props) => {
return <>second viewer</>;
},
},
]}
/>
</>
)
}I expect that the viewer will show me rows:
first viewer
second viewer
As I've declared. But using store to precache components (why?) make it wrong.
I see first viewer twice.
The example is synthetic. Actually I wanted to close data from the outer component into the check to process nested object, loading one by one from the server by clicking on them.
I have multiple JsonViewer component in a loop and Component closure is the same in each cycle that is wrong.
I suppose that best decision will be removing store from a package in general and let it be stateless component.
What do you think?
I'm glad to help you with it, but I need a lot of time to understand each line.