- This topic has 5 replies, 2 voices, and was last updated 6 years, 2 months ago by
.
-
Posts
-
Hey everyone,
I’m working on making some of my components more usable and trying to reduce duplicate code. In this sample gist, you can see I’m using <SocialMediaIcons> to output a chunk of social links. This works great in the edit function, but breaks the block if I try to put it in the save function. Any thoughts on how to make this component available in the save function as well? Thanks in advance for any thoughts!
Unfortunately there are some issues with getting JS driven blocks to work on the frontend, as crazy as that sounds. This is something they are working on. This may be related, but may not be.
What specifically breaks in this example?
When I try to reference the SocialMediaIcons component in the save function, I get an undefined error. “ReferenceError: SocialMediaIcons is not defined.” That component is defined in the edit function and works as expected in that sense.
Aw, missed this at first glance. Simple solution 🙂
You’re defining the component inside your edit function.
It’s best to pull it out into its own file or at least up outside of the registerBlockType function 🙂
Let me know if that doesn’t work!
That actually worked great! I extracted that out to its own file and everything is smooth sailing. Thanks, Zac!
- You must be logged in to reply to this topic.