我想动态加载 VueJS 组件的模板
。我想使用 jQuery 进行 AJAX 调用,服务器返回的任何内容都应该是 VueJS 组件的 template
。这是代码的简化版本,删除了 AJAX 调用,因为它与数据来自何处无关:
BoardFeed = Vue.extend
template: '<div>This should be replaced</div>'
data: ->
return items: null
created: ->
@template = "<div>Template returned from server, what I really want</div>"
在上面的示例中,我使用 created我认为它适合于此,但新模板永远不会呈现,只有旧模板。
有可能实现这个目标吗?
最佳答案
您可以在模板中使用v-partial
。加载部分后,您可以通过 Vue.partial()
注册它。然后替换 {{partial }}
值,从而呈现新的部分。
BoardFeed = Vue.extend
template: '<div v-partial="{{ partial }}">This should be replaced</div>'
partials: {"beforeLoad": "<div>This should be replaced</div>"}
data: ->
return {items: null, partial: "beforeLoad"}
created: ->
Vue.partial("afterLoad", "<div>Template returned from server, what I really want</div>")
@partial = "afterLoad"
(请原谅任何 CoffeeScript 错误,我对此不太熟悉)
关于javascript - VueJS - 如何使用 ajax 调用的结果动态初始化模板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27987937/