Per #2645250-179: [META] Start using reactive declarative JS programming for some new core admin UIs, this is a child issue to discuss one factor in a vdom library that might be important to us.
{this.props.foo} appears, it renders correctly whether foo is text or an element.{{ foo }} only creates a text node and errors if foo is an element. Instead, the "proper" way to pass in elements rather than text is via slots.A positive of the Vue way is that it more closely mirrors the draft Web Components Shadow DOM specification.
However, a negative of the Vue way is that it requires components to be opinionated about the input they receive. Many existing Vue components output things like {{ title }} without considering the possibility that a consumer might want to set that title to something containing HTML. A component that then wants to allow for that will need to change its template to instead render the title as <slot name="title"></slot>, but that then breaks consumers that are passing in plain-text titles via props.
During Drupal 8's conversion of all PHP templates to Twig, we found it very valuable for Twig templates to be able to print out {{ foo }} without any concern for whether it's plain-text or HTML. In that sense, we independently arrived at the same design choice that React did.
If we end up picking Vue, are we willing to accept that component templates will be required to use slots instead of props everywhere where the caller might want to pass in formatted text. And that that might also significantly limit which 3rd party components we can use?
?
Discuss.
Comments
Comment #2
Anonymous (not verified) commentedDoesn't the front-end headaches come from exactly this? Drupal returning "hardcoded"/hard to change HTML? If such component does not expect HTML but text then isn't that by design? Having hybrid rendering(some thing render on frontend, some things render on backend) means a bit more mess and less clarity on what's really what and where(being rendered). Anyway
<div v-html="the_foo_variable"></div>is probably the easiest solution.Comment #3
effulgentsia commentedComment #15
smustgrave commentedThank you for creating this issue to improve Drupal.
We are working to decide if this task is still relevant to a currently supported version of Drupal. There hasn't been any discussion here for over 8 years which suggests that this has either been implemented or is no longer relevant. Your thoughts on this will allow a decision to be made.
Since we need more information to move forward with this issue, the status is now Postponed (maintainer needs more info). If we don't receive additional information to help with the issue, it may be closed after three months.
Thanks!