VueJS - Как динамически инициализировать шаблон с результатом вызова ajax

Question

VueJS - Как динамически инициализировать шаблон с результатом вызова ajax

1

Я хочу загрузить template для VueJS-компонента динамически. Я хотел бы сделать вызов AJAX с помощью jQuery, и все, что возвращает сервер, должно быть template компонента VueJS. Здесь удалена упрощенная версия кода с вызовом 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, который, как я думал, подходит для этого, но новый шаблон никогда рендер, только старший.

Можно ли это достичь?

Nightwolf 16 янв. 2015, в 17:27

Источник

Теги:

javascript

vue.js

mvvm

coffeescript

1 ответ

Ещё вопросы

nils · Answer 1 · 2015-01-27T12-20-00.000Z

Вы можете использовать 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"

(и извините любые ошибки кофе script, я не очень хорошо знаком с ним)