首页 文章

Vue js和动态组件和内容

提问于
浏览 次
1

我想在VueJS中为我的项目实现Modal窗口 . 就像我在jQuery中一直做的那样：

  • 通过AJAX获取模态的HTML（HTML是动态的，后端使它成为可能）

  • 将HTML代码附加到BODY

但是VueJS有不同的逻辑，我真的不知道如何创建完全动态的模态窗口 .

我可以 create Modal window component 并将其附加到正文，但我不能将HTML（我从AJAX请求获得）放在组件内作为模板插槽

<slot></slot>.

那我该怎么做呢？也许一些最好的做法？

谢谢

javascript jquery ajax vue.js

2 回答

  • 0

    将模式元素设置为您希望HTML内容具有属性 v-html="modalContent" ，然后在您的vue代码中打开该模式时生成Ajax请求并将生成的HTML存储到 this.modalContent 中

    回复于
  • 0

    我解决了

    我们需要将我们的模态组件放在“#app”之外，其中包含所需的html（从AJAX获取）并将该实例作为新的vm启动 .

    并创建包装器来管理它

    Modal = { show(), hide(), change() ... }

    当然hide方法可以破坏当前的模态窗口VM等等 .

    所以在那之后我们将拥有功能齐全的模态窗口，希望能帮助别人 .

    回复于

相关问题