为了账号安全,请及时绑定邮箱和手机立即绑定

vue.use学习

标签:
Html5 Sass/Less

我们都知道,每次在使用Vue.use,就会联想到Vue.use(ElementUI), Vue.use(MintUI),等等,但是发现没,axios就不用使用Vue.use(),这是为什么呢?

严格来说,使用Vue.use()方法的都是依赖于Vue的组件,而axios他只是一个处理请求的一个库,不依赖于Vue,所以,他不需要Vue.use,因为他没有使用到 install方法,而其他使用Vue.use()方法的都是用了install方法。说了这么多,也不知道对不对,这就是我个人的理解,

如果有错误,希望广大网友,提出宝贵的意见,帮助我提升自己,谢谢,不喜勿喷。

接下来我们来看看组件是如何使用Vue.use()

首先我们先来看一下目录结构,自行安装node, vue-cli3
在这里插入图片描述

我们在components目录下新建一个loading的文件夹

新建一个 index.js 文件

新建一个loading.vue 文件

接下来随便写点东西,

loading.vue

<template>
  <div class="loading-box">
    Loading...
  </div>
</template>

index.js

// 引入组件
import LoadingComponent from './loading.vue'
// 定义 Loading 对象
const Loading = {
  // install 是默认的方法。当外界在 use 这个组件的时候,就会调用本身的 install 方法,同时传一个 Vue 这个类的参数。
  install: function (Vue) {
    Vue.component('Loading', LoadingComponent)
  }
}
// 导出
export default Loading

最终我们在main.js中引入

在这里插入图片描述
项目运行起来之后可以看到 loading的字眼
在这里插入图片描述

点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
Web前端工程师
手记
粉丝
23
获赞与收藏
130

关注作者,订阅最新文章

阅读免费教程

  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消