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


Posted in Javascript onJuly 03, 2018

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,
  },

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript firefox不显示本地预览图片问题的解决方法
Nov 12 Javascript
Prototype Template对象 学习
Jul 19 Javascript
理解JavaScript中Promise的使用
Jan 18 Javascript
前端性能优化及技巧
May 06 Javascript
JQuery遍历元素的后代和同胞实现方法
Sep 18 Javascript
Bootstrap里的文件分别代表什么意思及其引用方法
May 01 Javascript
JavaScript实现的DOM绘制柱状图效果示例
Aug 08 Javascript
JS/HTML5游戏常用算法之碰撞检测 像素检测算法实例详解
Dec 12 Javascript
Vue CLI3.0中使用jQuery和Bootstrap的方法
Feb 28 jQuery
js字符串类型String常用操作实例总结
Jul 05 Javascript
JS表单验证插件之数据与逻辑分离操作实例分析【策略模式】
May 01 Javascript
js Proxy的原理详解
May 25 Javascript
Vue props用法详解(小结)
Jul 03 #Javascript
JavaScript设计模式之代理模式简单实例教程
Jul 03 #Javascript
详解Vue中使用Echarts的两种方式
Jul 03 #Javascript
vue awesome swiper异步加载数据出现的bug问题
Jul 03 #Javascript
JavaScript设计模式之工厂模式简单实例教程
Jul 03 #Javascript
js实现各浏览器全屏代码实例
Jul 03 #Javascript
React Native基础入门之初步使用Flexbox布局
Jul 02 #Javascript
You might like
使用apache模块rewrite_module (转)
2007/02/14 PHP
php at(@)符号的用法简介
2009/07/11 PHP
PHP采用XML-RPC构造Web Service实例教程
2014/07/16 PHP
thinkphp的dump函数无输出实例代码
2016/11/15 PHP
PHP面向对象之领域模型+数据映射器实例(分析)
2017/06/21 PHP
Javascript MD4
2006/12/20 Javascript
使用JS操作页面表格,元素的一些技巧
2007/02/02 Javascript
Jquery ajax 同步阻塞引起的UI线程阻塞问题
2015/11/17 Javascript
JavaScript电子时钟倒计时
2016/01/09 Javascript
jQuery grep()方法详解及实例代码
2016/10/30 Javascript
JS实现的驼峰式和连字符式转换功能分析
2016/12/21 Javascript
微信小程序动态显示项目倒计时效果
2017/06/13 Javascript
解决JSON.stringify()自动将中文转译成unicode的问题
2018/01/05 Javascript
常用的 JS 排序算法 整理版
2018/04/05 Javascript
解决mpvue + vuex 开发微信小程序vuex辅助函数mapState、mapGetters不可用问题
2018/08/03 Javascript
vue学习笔记五:在vue项目里面使用引入公共方法详解
2019/04/04 Javascript
layui表格 返回的数据状态异常的解决方法
2019/09/10 Javascript
微信小程序实现倒计时功能
2020/11/19 Javascript
[39:02]DOTA2亚洲邀请赛 3.31 小组赛 B组 Mineski vs VGJ.T
2018/04/01 DOTA
[01:59]翻天覆地,因你而变,7.20版本地图更新速览
2018/11/24 DOTA
用Python编写一个简单的FUSE文件系统的教程
2015/04/02 Python
python3+requests接口自动化session操作方法
2018/10/13 Python
python scrapy爬虫代码及填坑
2019/08/12 Python
Pytorch自己加载单通道图片用作数据集训练的实例
2020/01/18 Python
python实现贪吃蛇游戏源码
2020/03/21 Python
使用Keras建立模型并训练等一系列操作方式
2020/07/02 Python
Python SQLAlchemy库的使用方法
2020/10/13 Python
Swisse官方海外旗舰店:澳大利亚销量领先,自然健康品牌
2017/12/15 全球购物
Lovedrobe官网:英国领先的大码服装品牌
2019/09/19 全球购物
加拿大在线隐形眼镜和眼镜店:VisionPros
2019/10/06 全球购物
工作迟到检讨书
2014/02/21 职场文书
公司爱心捐款倡议书
2014/05/14 职场文书
学习保证书100字
2015/02/26 职场文书
父亲节寄语大全
2015/02/27 职场文书
2015年班干部工作总结
2015/04/29 职场文书
Vue如何实现组件间通信
2021/05/15 Vue.js