framework7 with vuejs using axios

Question

我是 framework7 和 vuejs 的新手。这是导入它的正确方法吗？在此之后，我如何从其他页面引用公理？

下面是我的主.js我不确定它是否正确导入或我错过了一些步骤？

// Import Vue
import Vue from 'vue'
// Import F7
import Framework7 from 'framework7'
// Import F7 Vue Plugin
import Framework7Vue from 'framework7-vue'
// Import Routes
import Routes from './routes.js'
// Import Vue Resource for http .... not recommended anymore
//import VueResource from './vue-resource.js'
//http requests and other stuff
import Axios from './axios.min.js'
// Import App Component
import App from './app.vue'
// Init F7 Vue Plugin
Vue.use(Framework7Vue)
// Init App
new Vue({
  el: '#app',
  template: '<app/>',
  // Init Framework7 by passing parameters here
  framework7: {
    root: '#app',
    /* Uncomment to enable Material theme: */
    // material: true,
    routes: Routes
  },
  // Register App Component
  components: {
    app: App
  },
  //methods
  methods: {
    getAppName: function () {
      console.log(this.appName)
    },
    msgBox: function () {
      alert('Message Box');
    },
    calNum: function () {
      alert(3 + 5);
    }
  }
});

Answer 1

有两种主要方法可以做到这一点。

1(首选(在任何使用它的模块中导入公理

标准方法是在任何需要它的模块中导入 axios。 例如在test.vue

<script>
import axios from 'axios';
export default {
    mounted: function() {
        axios.get(....)

2(我自己做(导入一次并使其全球化

这更简单，并且只需执行一次，您不需要在所有模块中每次都执行此操作。

A. main.js中导入公理

B. 通过此使其全球化

window.axios = axios;

在代码中任何位置的这一行之后，您都可以访问 Axios 变量并可以使用它

(编辑(

实际上，现在我看到您从文件中导入了axios。最好使用 npm 来做。

a. 在项目文件夹的命令行中运行此命令

npm install --save axios

b. 将您的导入更改为此

import Axios from 'axios'