Serializing Props as Element Attributes

So now there's one last nugget of information that we should cover about props, and that's a utility that EdgeJS comes with called SerializeExcept and SerializeOnly. These utilities allow us to set and serialize props as direct attributes on elements.

Let's take a closer look at how they work.

Attribute Serialization

Within our app layout, let's say we have our main content wrapped in a <main> element, and we want to transfer all the props to this element's attributes, except for the "title" prop. Thanks to these utilities, we can easily achieve this by…

1. Inside the component's template, use double curly braces to access the $props object.

2. Then, use the $props.serializeExcept(['title']) directive to specify which prop to exclude from serialization, in this case, "title."