templates - 我可以将 "inline-template"组件传递给另一个 "inline-template"组件吗？

Question

我的想法是这是不可能的，或者我缺少一个额外的步骤。无论哪种方式，我都被卡住了，无法弄清楚。

使用内联模板的原因是能够使用 Laravel Blade 语法并结合 Vue Js 的强大功能。似乎是两者中最好的。解释问题的基本结构分解:

<nav-container inline-template >
    //content

    //import this component into the party!
    <nav-topics></nav-topics>

</nav-container>

<nav-topics inline-template>
    //content
</nav-topics>

我收到控制台错误:

无法安装组件:未定义模板或渲染函数。

我知道组件“nav-topics”在没有内联模板的情况下工作，因为如果我将它更改为非内联的普通组件，那么内容将被引入。我将它设置在“nav-container”中"到 "import .. from"和
设置组件名称，正如我所说，我可以让它工作而不是内联版本!

当然，您不能只将父组件设置为“内联模板”组件而不是他们的子组件？

如果我在“nav-container”文件中使用 Blade 文件导入，它有点工作，但这不能正常工作。我无法发出事件或组件之间的常规通信。

@include('nav/_nav_topics')

Answer 1

它们嵌套得很好，只要外层知道内层，并且您有一些模板(内联或组件规范)与每个模板相关联。

内联模板简单地覆盖它提供给的一个实例的规范模板。如果需要，您可以在多个位置为同一组件使用不同的内联模板。

Vue.component('dooDad', {});
Vue.component('thingAmajig', {template: '<div>Fooey</div>'});
new Vue({
  el: '#app'
});

<script src="//cdnjs.cloudflare.com/ajax/libs/vue/2.4.2/vue.min.js"></script>
<div id="app">
  <doo-dad inline-template>
    <div>
      There's a thing-amajig here.
      <thing-amajig inline-template>
        <div>That's me</div>
      </thing-amajig>
      <thing-amajig></thing-amajig>
    </div>
  </doo-dad>
</div>