详解VUE中常用的几种import（模块、文件）引入方式

更新时间：2018年07月03日 09:56:02 作者：butterflyer

这篇文章主要介绍了详解VUE中常用的几种import（模块、文件）引入方式，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧

1 引入第三方插件

import echarts from 'echarts'

2 引入工具类

第一种是引入单个方法

import {axiosfetch} from './util';

下面是写法，需要export导出

export function axiosfetch(options) {

}

第二种导入成组的方法

import * as tools from './libs/tools'

其中tools.js中有多个export方法,把tools里所有export的方法导入

vue中怎么用呢？

Vue.prototype.$tools = tools

直接用 this.$tools.method调用就可以了

说到这 export 和 export default 又有什么区别呢？

下面看下区别

先是 export

import {axiosfetch} from './util'; 
 //需要加花括号 可以一次导入多个也可以一次导入一个，但都要加括号

如果是两个方法

import {axiosfetch,post} from './util';

再是 export default

import axiosfetch from './util'; //不需要加花括号 只能一个一个导入

3.导入 css文件

import 'iview/dist/styles/iview.css';

如果是在.vue文件中那么在外面套个style

<style>
 @import './test.css'; 

</style>

4.导入组件

 import name1 from './name1'
import name2 from './name2'
  components:{
     name1,
     name2,
  },

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

vue制作点击切换图片效果的详细思路与步骤
这篇文章主要给大家介绍了关于vue制作点击切换图片效果的详细思路与步骤,图片切换是一个很经典的Vue入门学习案例,在你学习完一些基本的v-指令后,你可以尝试去写一个简单的demo去巩固和熟悉这些指令的使用方法,需要的朋友可以参考下
2023-11-11
前端低代码form-generator实现及新增自定义组件详解
这篇文章主要给大家介绍了关于前端低代码form-generator实现及新增自定义组件的相关资料,form-generator是一个开源的表单生成器,可以帮助我们快速构建各种表单页面,需要的朋友可以参考下
2023-11-11
el-input无法输入的问题和表单验证失败问题解决
在做项目的时候发现一个情况,输入框无法输入值并且表单校验失灵,所以下面这篇文章主要给大家介绍了关于el-input无法输入的问题和表单验证失败问题解决的相关资料,需要的朋友可以参考下
2023-02-02
vue实现一个滚动条样式
滚动条能够给用户带来极好的体验效果，今天通过本文给大家分享vue实现一个滚动条样式，代码简单易懂，需要的朋友参考下吧
2021-07-07
完美解决axios在ie下的兼容性问题
下面小编就为大家分享一篇完美解决axios在ie下的兼容性问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2018-03-03
Vue组件的实现原理详细分析
在日常业务开发中我们会经常封装一些业务组件,下面这篇文章主要给大家介绍了关于Vue组件的实现原理,文中通过示例代码介绍的非常详细,需要的朋友可以参考下
2023-01-01
vue实现与安卓、IOS交互的方法
这篇文章主要介绍了vue实现与安卓、IOS交互的方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2018-11-11
Vue+Element UI+Lumen实现通用表格分页功能
这篇文章主要介绍了Vue+Element UI+Lumen实现通用表格分页功能，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2019-02-02
详解vue服务端渲染(SSR)初探
本篇文章主要介绍了详解vue服务端渲染(SSR)初探，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-06-06
vue请求接口并且携带token的实现
本文主要介绍了vue请求接口并且携带token的实现，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
2022-07-07