Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

The children utility function causes the child components to initialize in advance. #279

Open
siaikin opened this issue Nov 3, 2023 · 3 comments
Labels
documentation Improvements or additions to documentation

Comments

@siaikin
Copy link

siaikin commented Nov 3, 2023

Describe the bug

I use Context to inject some data globally, and I optimize the access to children according to the examples given in the tutorial, that is, using the children utility function to wrap props.children. However, the child components always access the initialValue of createContext through useContext, instead of the data I provide through Provider.

Your Example Website or App

https://playground.solidjs.com/anonymous/29fa1b7c-efd7-4f32-a6f7-1a37c22b047c

Steps to Reproduce the Bug or Issue

  1. Go to https://playground.solidjs.com/anonymous/29fa1b7c-efd7-4f32-a6f7-1a37c22b047c
  2. Button render -1, this is initialValue.
  3. Please comment out this IS NOT WORK code, 16-19 lines.
  4. Than comment in IS WORK code, 22-24 lines.
  5. Butten Render -2, this is provide by Context.Provider.

Expected behavior

I hope that when using the children utility function, the child components will not be initialized in advance, causing useContext to be unable to get the provided value.

Screenshots or Videos

No response

Platform

  • OS: Windows
  • Browser: Chrome

Additional context

No response

@titoBouzout
Copy link
Contributor

See this solidjs/solid#1926
TLDR: using children changes the context on which things run, so children isn't evaluated inside the context as you may expect.

@siaikin
Copy link
Author

siaikin commented Nov 3, 2023

See this solidjs/solid#1926 TLDR: using children changes the context on which things run, so children isn't evaluated inside the context as you may expect.

very grateful for your answer, I spent several hours troubleshooting this issue. Perhaps we could add explanations to the documentation or tutorials to explain this hidden behavior.

@ryansolid
Copy link
Member

Yeah docs could be clearer here with a context example. We say that it resolves the children so they can be introspected, but for those not familiar with that Solid doesn't use a VDOM so resolved means do the rendering it isn't obvious this can happen. We use conditional rendering as an example but not context. https://www.solidjs.com/docs/latest/api#children

@ryansolid ryansolid added the documentation Improvements or additions to documentation label Nov 3, 2023
@ryansolid ryansolid transferred this issue from solidjs/solid Nov 3, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
documentation Improvements or additions to documentation
Projects
None yet
Development

No branches or pull requests

3 participants