Vue.js怎么能像Angular.js一样配置templateUrl呢？

Question

我喜欢Vue.js的简单性,但我不想用browserify或webpack来复杂化它.我喜欢Angular中的templateUrl之类的东西,所以我可以直接使用Nginx为部分页面(通常是组件)提供服务.我怎么能设置这个？它没有正式建议,很难得到帮助.

Answer 1

据我所知,Vue没有内置任何内置功能,但如果你愿意的话,你可以使用异步组件伪造它.

Vue.component('example', function (resolve, reject) {
  $.get('templates/example.html').done(function (template) {
    resolve({
      template: template
    })
  });
});

您也可以在HTML中执行类似的操作.

<div id="app"></div>

<template id="example">
  <div>
    <h1>{{ message }}</h1>
  </div>
</template>

然后你可以这样做:

new Vue({
  el: '#app',
  components: {
    example: {
      template: '#example',
      data: function () {
        return {
          message: 'Yo'
        }
      }
    }
  }
});

虽然,我认为花时间熟悉browserify或webpack是非常值得的投资.特别是因为你可以使用vueify.