Question

我已经开发了CMS。这是Vue SPA。这将连接到Express / Node服务器，后者通过请求将JSON形式的api内容传递给它。但是现在我需要构建主站点。我决定在车把上这样做，因为我不希望此页面成为SPA，而是希望它成为具有不同页面等的更传统的网站。我还购买了用于该主站点的模板。据我了解，此模板可与车把配合使用，因为它包含一些JavaScript文件（例如jquery），如果我将其设为vue应用程序，则会发生冲突。我的理解正确吗？还是我可以使用vue制作一个不是spa的网站，该网站也包含其他javascript文件。我之所以这样问，是因为我需要为主要站点开发一些类似于组件的小型功能，而我更希望在Vue中进行编码。这使我想到了最后一个问题，即是否可以在车把内使用Vue组件。我可以安装/创建可以加载到其中的组件吗？

对我的理解提供的任何帮助将不胜感激，因为尽管我觉得我了解SPA上下文中的vue，该SPA可以向JSON发送API请求。我不太了解如何将其用于其他网页上的小型定制组件，或者是否可以将Vue用于开发非SPA形式的网站。谢谢。

Answer 1

您不需要将vue-router导入Vue项目。这就是使它成为SPA的原因。

设置中最简单的方法可能是运行Vue而无需构建过程。只需导入带有vue.min.js标签的<script>，就可以直接使用Vue.component()定义组件。然后，您可以使用new Vue({ el: "#app" });运行Vue应用程序，并且正在构建组件。您也可以在同一页面上拥有多个Vue实例。因此，这是一个示例：

Vue.component('demo', {
  template: `
    <ul>
      <li v-for="item in data" :key="item">{{ item }}</li>
    </ul>`,
  data () {
    return {
      data: [3, 5, 6, 8]
    };
  }
});

new Vue({ el: '#vue-integration' });

#vue-integration {
  border: 2px solid rgba(255, 0, 0, 0.9);
  background: rgba(255, 0, 0, 0.1);
  width: 80%;
  margin: 10px auto 0 auto;
  padding: 7px;
}

<script src="https://cdn.jsdelivr.net/npm/vue@2.6.0"></script>

<div class="your-awesome-page">

  Your awesome page
  
  <div id="vue-integration">
    A vue demo.
    <demo></demo>
  </div>
 
</div>

将Vue与把手和Node / Express结合使用

1 个答案: