我正在try 用很棒的vue制作一个 bootstrap 模式组件.js,但我还没有找到一个好的方法来转换——也就是说,我想将包含背景、模态窗口、关闭按钮等的几个嵌套元素绑定到一个组件中.然后,该组件将需要包装放置在其中的标记.

组件

<div class="modal fade">
  <div class="modal-dialog">
    <div class="modal-content">

    // transcluded content goes here.

    </div>
  </div>
</div>

内容

<bs-modal>
  <h1>Some title lol</h1>
  <p>内容 'n stuff</h1>
</bs-modal>

排除

<div class="modal fade">
  <div class="modal-dialog">
    <div class="modal-content">

      <h1>Some title lol</h1>
      <p>内容 'n stuff</h1>

    </div>
  </div>
</div>

推荐答案

啊,找到了.

http://vuejs.org/guide/components.html#Content_Distribution_with_Slots

所以,

<div class="modal fade">
  <div class="modal-dialog">
    <div class="modal-content">

    <slot></slot>

    </div>
  </div>
</div>

Vue.js相关问答推荐

如何禁用Vuetify v—stepper操作按钮

使用V-TOOLTIP(实例化)使工具提示在V-文本字段中显示清晰的图标

Vue3如何将自定义事件绑定到路由视图中的特定组件?

如何在 vuejs 中导入和使用本地 .csv 文件

VueJS CKeditor5 上传图片

Vuetify 复选框:如何停止点击事件?

如何在Typescript语言Vuejs中使用watch功能?

使用 Vue 和 JS 下载 CSV 文件

Vuetify 容器不会填充高度

Angular 5 中的 功能

Vue.js 无法切换字体真棒图标

在Vue.js中从父组件执行子方法

如何在 vuetify 中将工具提示添加到数据表标题?

异步方法不等待函数

如何从 vue 组件调用 App.vue 中的方法

将 SignalR 与 Vue.js 和 Vuex 集成

Vuejs css 范围性能

在 Vuejs 中放置 firebase.auth().onAuthStateChanged() 的位置

Vue.JS 2.0 修改不相关数据时速度慢

Vue.js 无法读取 null 的属性 length长度