vue_ssr.templatetags

1from .vue_ssr import render_vue
2
3__all__ = ["render_vue"]
@register.simple_tag
def render_vue(entry: str, props: dict[str, typing.Any] | None = None, **kwargs):
13@register.simple_tag
14def render_vue(entry: str, props: dict[str, Any] | None = None, **kwargs):
15    """
16    Render a Vue SSR entry with the given props.
17    :param entry: The server entry name.
18    :param props: The props passed to the entry.
19    :param kwargs: The props passed to the entry. Takes precedence over the props argument.
20    :return: The rendered HTML.
21
22    Example:
23    ```django
24    {% load vue_ssr %}
25    <my-app>{% render_vue "app" myProp="value" %}</my-app>
26    ```
27    """
28
29    props = props or {}
30    props = {**props, **kwargs}
31
32    data: dict[str, Any] = {}
33
34    if props:
35        data["props"] = props
36
37    rendered = render(entry, props)
38
39    if rendered is None:
40        # SSR rendering failed, fall back to client-side rendering
41        data["forceClientRender"] = True
42
43    output = ""
44
45    if data:
46        output += '<script type="application/json">%s</script>' % json.dumps(data)
47
48    if rendered:
49        output += rendered
50
51    return mark_safe(output)

Render a Vue SSR entry with the given props.

Parameters
  • entry: The server entry name.
  • props: The props passed to the entry.
  • kwargs: The props passed to the entry. Takes precedence over the props argument.
Returns

The rendered HTML.

Example:

{% load vue_ssr %}
<my-app>{% render_vue "app" myProp="value" %}</my-app>