javascript - Vue.js 中的符号 ' 不适用于我的模板

Question

我开始学习 Vue.js。我从一个例子中抓取了一些示例代码，但它的模板在一个 HTML 文件中。我想将我的 app.js 作为模板放入，就像它们在我观看的视频教程中显示的那样。但是当我这样做时，我的编辑器向我显示了一个错误，而且我的控制台也发出了错误。这是我的代码:

var app = new Vue({
    el: "#app",
    data: {
        ...
    },
    filters: {
        ...
    },
    methods: {
        ...
    },
    template: '
      <div>
      
        <h1 class="main">Sunrise Vitamins</h1>
        
        <ul class="vitamins">
          <li class="vitamin_type" v-for="vitamin in vitamins" v-on:click="toggleActive(vitamin)" v-bind:class="{ 'active' : vitamin.active }">
            
            <span>{{vitamin.name}}</span> <span>{{vitamins.price | currency}}</span>
          
            </li>
        </ul>
        
        <p class="total">
          <span>Total:</span> <span>{{total() | currency}}</span>
        </p>
    
      </div>
    '
});

Answer 1

您使用了错误的符号，它不是作为撇号，它位于键盘左上角的 1 旁边，如果您使用的是 Mac，则为 esc。抱歉，不确定它叫什么。它不仅适用于 Vue，它还是 ES6 的特性。我建议您在此处查看该内容以及 ECMAScript 2015 中引入的其他功能:

https://babeljs.io/learn-es2015/#template-strings