全局变量、全局方法和全局组件、局部组件

204 阅读1分钟

全局变量和全局方法

1、单独新建一个全局变量文件global.js,模块中定义一些变量初始状态和方法,用export default 暴露出去。

const baseUrl="http://192.168.1.1";
function httpGet(url,params){
    console.log("httpGet")
}
function httpPost(url,params){
    console.log("httpPost")
}
export default {
    baseUrl,
    httoGet,
    httpPost
}

2、在main.js中引入,并通过Vue.prototype挂载到vue实例上面。

import global from './common.js';
Vue.prototype.Global=global;

3、使用

this.Global.名称

全局组件

index.js

import LoadMore from "./LoadMore.vue";
export default (Vue)=>{
    Vue.component(LoadMore.name,LoadMore);
}

main.js

import LoadMore from './components/LoadMore/index.js';
Vue.use(LoadMore);

局部组件

在使用的.vue文件中

import LoadMore from "./LoadMore.vue";
export default{
   name: "当前页面的name",
   components:{LoadMore}
}