SolidJS•2y ago

Stricter JSX?

Hey peeps, I recently upgraded to 1.7.0 and seems like there is new stricter JSX. I read the CHANGELOG and understand the issue a bit, i.e. removing function form from JSX.Element. How ever my code (especially in test) use function form quite a bit, like this.

<Provider>
{() => {
  actions = userContext();
  actions.doesSomethingForTesting();

  return <TestingComponent />
}}
</Provider>

<Provider>
{() => {
  actions = userContext();
  actions.doesSomethingForTesting();

  return <TestingComponent />
}}
</Provider>

What should I do make it works without changing too much code? Thanks!

4 Replies

mdynnl•2y ago

just IIFE it or wrap it with untrack (most desirable) if you just want to inline

phunglesonOP•2y ago

Ah yeah cool, I didn't think about IIFE, as about untrack I guess all reactive vars inside the function will be disabled? While IIFE still retain reactiveness?

mdynnl•2y ago

yep, yep

Alex Lohr•2y ago

In this case, you could also use

<Provider>
{(userContext().doesSomethingForTesting(), <TestingComponent />)}
</Provider>

<Provider>
{(userContext().doesSomethingForTesting(), <TestingComponent />)}
</Provider>

Gaming

Programming

Stricter JSX?