Question

我正在接管一个包含许多AJAX加载HTML代码段的项目。我想尽可能地逐步介绍Vue.js。我不尝试异步加载任何组件定义或javascript，但我想加载具有v-on:click绑定的HTML代码段，

<button class="btn btn-primary" v-on:click="showModal=true">
    Show Modal Dialog
</button>

vuejs是否仍然可以解析来自jQuery的html片段并读取v- *属性？

Answer 1

您可以使用<v-runtime-template>在运行时加载Vue模板字符串：

<template>
  <div id="app">
    <template v-if="template">
      <v-runtime-template :template="template"></v-runtime-template>
    </template>
    <div v-else>Loading...</div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      template: ''
    }
  },
  mounted() {
    this.template = this.getVueTemplateFromServer();
  },
  methods: {
    getVueTemplateFromServer() { /*...*/ }
  }
}
</script>

demo

Vue.js绑定加载了Ajax的v-on点击处理程序

1 个答案: