前端基础内容

一、vue项目基本结构

api ：核心接口，调用后端的

assets ：资源

components ：组件

latout ：布局

router ：路由

store ：存储

utils ：工具

views ：视图层

.env.development ：项目配置

package.json ：依赖包

二、前端全局变量声明与使用

1、创建全局变量存储文件global.js

       文件内容如下：

        const：声明全局变量

        export default ：导出全局变量

import Vue from 'vue';

import Vuex from 'vuex';
Vue.use(Vuex);

const state = {
  city: 1
}

const mutations = {
  setCity(state, value) {
    state.city = value;
  },
}


export default {
  state,
  mutations,
  commonUrl,
  mapImageUrl,
  mapImageThreeUrl,
  layerName,

};

2、在main.js文件中声明定义，之后就可以全局使用

// 引入文件
import globalParameter from '@/store/global.js'


// 注册到Vue中，全局使用
Vue.prototype.parameter = globalParameter 

3、全局变量使用

3.1 在VUE界面使用，直接使用就可以

// mutations为定义的全局变量
this.paramrter.mutations

3.2 在js文件中，需要import 一下，再使用