认识Vue 的 export、export default、import

认识Vue 的 export、export default、import首先要知道 export import exportdefaul 是什么 nbsp 作为 copy 砖家 具体概念我还真是迷糊 查阅资料 ES6 模块主要有两个功能 export 和 import export 用于对外输出本模块 一个文件可以理解为一个模块 变量的接口 import 用于在一个模块中加载另一个含有 export 接口的模块 也就是说使用 export 命令定义了模块的对外接口以后 其他 JS

首先要知道export,import ,export default是什么

 

作为copy砖家,具体概念我还真是迷糊…

查阅资料:ES6模块主要有两个功能:export和import
-export用于对外输出本模块(一个文件可以理解为一个模块)变量的接口
-import用于在一个模块中加载另一个含有export接口的模块。
也就是说使用export命令定义了模块的对外接口以后,其他JS文件就可以通过import命令加载这个模块(文件)。这几个都是ES6的语法。


一、export和import(一个导出一个导入)

一个a.js文件有如下代码:

export var name="李四";

在其它文件里引用如下:

 

import { name } from "/.a.js" //路径根据你的实际情况填写 export default { data () { return { } }, created:function(){ alert(name)//可以弹出来“李四” } }

 

上面的例子是导出单个变量的写法,如果是导出多个变量就应该按照下边的方法,用大括号包裹着需要导出的变量:

 var name1="李四"; var name2="张三"; export { name1 ,name2 } 
在其他文件里引用如下:

 

import { name1 , name2 } from "/.a.js" //路径根据你的实际情况填写 export default { data () { return { } }, created:function(){//create:打开文件默认执行的方法 alert(name1)//可以弹出来“李四” alert(name2)//可以弹出来“张三” } }

 

如果导出的是个函数呢,那应该怎么用呢,其实一样,如下

function add(x,y){ alert(x*y) // 想一想如果这里是个返回值比如: return x-y,下边的函数怎么引用 } export { add }

在其他文件里引用如下:

 

import { add } from "/.a.js" //路径根据你的实际情况填写 export default { data () { return { } }, created:function(){ add(4,6) //弹出来24 } }

 

二、export与export default

export跟export default 有什么区别捏?如下:

这样来说其实很多时候export与export default可以实现同样的目的,只是用法有些区别。注意第四条,通过export方式导出,在导入时要加{ },export default则不需要。使用export default命令,为模块指定默认输出,这样就不需要知道所要加载模块的变量名。

 

var name="李四"; export { name } //import { name } from "/.a.js" 可以写成: var name="李四"; export default name //import name from "/.a.js" 这里name不需要大括号

 

 

再看第3条,在一个文件或模块中,export、import可以有多个,export default仅有一个,也就是说如下代码:

var name1="李四"; var name2="张三"; export { name1 ,name2 }

 

也可以写成如下,也是可以的,import跟他类似。

 var name1="李四"; var name2="张三"; export name1; export name2;

————————————–==》点滴积累。

1.1*1.1*1.1*1.1*…=无限大…

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/233115.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 详解单调栈算法

    详解单调栈算法前言如果你对这篇文章可感兴趣,可以点击「【访客必读-指引页】一文囊括主页内所有高质量博客」,查看完整博客分类与对应链接。栈属于基础数据结构之一,基础到仅用「后进先出」这四个字即可完整概括其核心特征。然而,基础并不代表着简单,「后进先出」的背后反而隐藏着多样的变化与极其广泛的应用。在本篇文章中,我们将针对在基础栈上稍加改动所形成的「单调栈」算法进行详解。该算法与「单调队列」组成了算法题中最常考察的线性数据结构,属于面试中必知必会的算法知识。栈首先我们来回忆一下「栈」。「栈」是一种「后进先出」的线

    2022年9月23日
    4
  • Tomcat日志切割总结[通俗易懂]

    Tomcat日志切割总结[通俗易懂]目录目录前言1.创建shell脚本进行catalina.out日志文件切割2.使用log4j成功使catalina.out文件实现分割3.用cronolog软件来分割Tomcat的catalina.out文件假设我们想日志以catalina.2018-08-31.out这种方式分割前言我们都知道将一个项目部署到Tomcat之后,Tomcat服…

    2022年6月20日
    47
  • acwing-1170. 排队布局(差分约束)[通俗易懂]

    acwing-1170. 排队布局(差分约束)[通俗易懂]当排队等候喂食时,奶牛喜欢和它们的朋友站得靠近些。农夫约翰有 N 头奶牛,编号从 1 到 N,沿一条直线站着等候喂食。奶牛排在队伍中的顺序和它们的编号是相同的。因为奶牛相当苗条,所以可能有两头或者更多奶牛站在同一位置上。如果我们想象奶牛是站在一条数轴上的话,允许有两头或更多奶牛拥有相同的横坐标。一些奶牛相互间存有好感,它们希望两者之间的距离不超过一个给定的数 L。另一方面,一些奶牛相互间非常反感,它们希望两者间的距离不小于一个给定的数 D。给出 ML 条关于两头奶牛间有好感的描述,再给出 MD

    2022年8月9日
    8
  • slam技术原理_SRAM特点

    slam技术原理_SRAM特点SLAM是Simultaneouslocalizationandmapping缩写,意为“同步定位与建图”,主要用于解决机器人在未知环境运动时的定位与地图构建问题,为了让大家更多的了解SLAM,以下将从SLAM的应用领域、SLAM框架、SLAM分类(基于传感器的SLAM分类)来进行全面阐述,本文仅对没有接触过SLAM的新人进行的科普…

    2022年10月1日
    3
  • 指令字长,机器字长,存储字长的关系_指令字长的概念

    指令字长,机器字长,存储字长的关系_指令字长的概念指令字长、存储字长、机器字长、时钟周期、机器周期、指令周期、取址周期、存取周期的关系考研做题途中遇到这些问题,发现自己掌握的很模糊,遂写下此篇,加深记忆。1、机器字长、存储字长、指令字长机器字长:CPU一次能够处理的数据的位数。通常等于寄存器的位数。例子:windows64位/32位,这里的64位和32位指的就是该操作系统的机器字长。存储字长:计算机存储器中一个存储单元可以存储的位数。例子:某某计算机按照字节编址,即说明该计算机的存储字长为1B=8位。指令字长:计算机内一条指令的位数。这里通常指

    2022年8月31日
    2
  • Python如何将py文件打包成exe[通俗易懂]

    Python如何将py文件打包成exe[通俗易懂]安装pyinstaller打开cmd窗口,输入pipinstallpyinstaller,命令行输出successfully表示成功。生成exe文件一、单个py文件在py文件目录下,打开c

    2022年7月6日
    39

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号