Vue是否允许模板继承像Symfony使用Twig一样?

时间:2018-07-06 08:26:37

标签: inheritance vue.js vue-component

我希望能够在Vue组件的模板中定义块,如下所示:

{# templates/blog/layout.html.twig #}
{% extends 'base.html.twig' %}

{% block body %}
    <h1>Blog Application</h1>
    {% block content %}{% endblock %}
{% endblock %}

然后在其他组件中使用上述模板,例如:

{# templates/blog/index.html.twig #}
{% extends 'blog/layout.html.twig' %}

{% block content %}
    {% for entry in blog_entries %}
        <h2>{{ entry.title }}</h2>
        <p>{{ entry.body }}</p>
    {% endfor %}
{% endblock %}

示例来自:https://symfony.com/doc/current/templating/inheritance.html

这可能吗?我已经在使用扩展API(https://vuejs.org/v2/api/#Vue-extend),但是无法覆盖特定的块。

谢谢:)

1 个答案:

答案 0 :(得分:2)

Vue本身不允许这样做,不支持。

但是,如果您使用的是Vue的Single File Components,则可以使用支持此功能的模板引擎(例如pug或nunjucks)来编写模板。

要了解如何将pug与vue-loader结合使用,请参见here