vue js 插槽未显示模板布局数据

问题描述

我第一次在 vue.js 中使用插槽进行布局。根据参考，我包含了该组件并在我需要它的适当位置使用了 slot 标签，但是 slot 标签仍然无法呈现我想要在布局页面上显示的标签或数据。我在控制台日志中没有发现任何错误，我的页眉组件和页脚组件都被成功包含，并出现在网页上。但插槽标签不起作用。 这是我的代码。请帮我找出我的错误。

Slottest.vue

<template>
  <div>
    <test-component>
      <h1>Testing Slots</h1>
    </test-component>
  </div>
</template>

<script>
import TestComponent from "./Test";
export default {
  components: { TestComponent },};
</script>

测试.vue

<template>
  <div>
    <header-content> </header-content>
    <slot> </slot>
    <footer-content> </footer-content>
  </div>
</template>
    
<script>
import HeaderContent from "./Header";
import FooterContent from "./Footer";
export default {
  components: { HeaderContent,FooterContent },};
</script>

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）