#react - how to make the commented section a dynamic check

30 messages · Page 1 of 1 (latest)

proud roost
#

not sure I follow your actual question. what do you want entry to be?

#

no clue how astro works

#

that question makes zero sense in relation to react. what do you mean by "read the children and set the values"?

#

right. components cannot be async. you use useEffect() and set the resulting values to state
note: I think this only applies to client-side components. apparently SSR components can be async.

#

yes. see above.

#

inside

# 
JSON.parse(JSON.stringify(children.props)).value.trim().split(":");

whatever you're attempting to accomplish with this is just icky. you probably don't want to be doing this.

#

why the heck are you randomly stringifying and parsing things all over the place?
click the link above. read through it from the start.

#

children is an array (or at least acts like one)

#

🤡

image.png
proud roost
# 
function Test({ children }) {
  console.log('props', children.props);
  console.log('propsMap', children.map(c => c.props))
  ...
}
image.png
#

again, no clue what you're actually attempting

#

also no clue where this is coming from

#

I'm guessing you want the tooltip prop from the child. your code fails if there's more than one child. you need to stop doing that stringify/parse milarky

# 
function Test({ children }) {
  const childProps = Array.isArray(children) ? children.flatMap(c => c.props) : children.props;
  console.log('props', childProps);
  ...
}
#

that's as clear as mud...

#

you've clarified nothing for me...

#
  • you're using children poorly.
  • you need a useEffect() based on children
#

using children like that will fail if there is more than one child

#

multiple MyToolTips maybe? not multiple children inside MyToolTips

#

... you keep adding small vague hints at what's going on but none of it is clear. show how you're loading these files (other than require() because that's not going to work)

#

So where do props come into play? Why are you using children.props?

#

…

#

so you're doing this?

<MyToolTips>
  <SomeChild value="a tooltip:id\n" />
<MyToolTips>

why?

#

ya, saying that again doesn't help. you're skipping the entire middle part that links your markdown to the resulting component

#

not only would that not work because of what I mentioned already (about multiple children), but that doesn't match what you've shown

#

cool, I got that part. you still haven't shown how/where you're reading the markdown and/or converting it to react components.

#

where do you think you've shown the reading of a MD file?