认识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)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • python 移动文件或文件夹操作

    python 移动文件或文件夹操作目录:1、python中对文件、文件夹操作时经常用到的os模块和shutil模块常用方法2、文件操作方法大全3、目录操作方法大全————————————————————————————–1、python中对文件、文件夹操作时经常用到的os模块和shutil模块常用方法。1.得到当前工作目录,即当前Python脚本工作的目录路径:os.getcwd()2.返回指定目录下的所有文件和目录名:os.li

    2022年5月7日
    284
  • mysql数据库高可用方案_MySQL集群方案

    mysql数据库高可用方案_MySQL集群方案在分布式系统中,我们往往会考虑系统的高可用,对于无状态程序来讲,高可用实施相对简单一些,纵向、横向扩展起来相对容易,然而对于数据密集型应用,像数据库的高可用,就不太好扩展。我们在考虑数据库高可用时,主要考虑发生系统宕机意外中断的时候,尽可能的保持数据库的可用性,保证业务不会被影响;其次是备份库,只读副本节点需要与主节点保持数据实时一致,当数据库切换后,应当保持数据的一致性,不会存在数据缺失或者数据…

    2025年7月15日
    2
  • viewstate java_ASP.NET之ViewState

    viewstate java_ASP.NET之ViewState什么是ViewState?在asp时代,大家都知道一个html控件的值,比如input控件值,当我们把表单提交到服务器后,页面再刷新回来的时候,input里面的数据已经被清空.这是因为web的无状态性导致的,服务端每次把html输出到客户端后就不再与客户端有联系.asp.net巧妙的改变了这一点.当我们在写一个asp.net表单时,一旦标明了formrunat=server,那…

    2022年7月21日
    10
  • vim 注释快捷键_vim编辑器快捷键

    vim 注释快捷键_vim编辑器快捷键我是个vim新手,非常喜欢这个工具,因为纯手工操作吧。可是有些快捷键还是不知道,写Python的时候经常要调试,会批量注释掉一些代码,vim不像pycharm那样Ctrl+/就可以了,反注释还是Ctrl+/。不过vim在这方面显得更强大更灵活点。有两种方法可以实现:第一种方法批量插入字符快捷键:Ctrl+v进入VISUALBLOCK(可视块)模式,按j(向下选取列)或者k

    2022年8月15日
    3
  • NHibernate 缓存

    NHibernate 缓存NHibernate支持两种级别的缓存,即一级缓存以及二级缓存。一级缓存一级缓存就是ISession缓存,在ISession的生命周期内可用,多个ISession之间不能共享缓存的对象,通过ISessionFactory创建的ISession默认支持一级缓存,不需要特殊的配置。在NHibernate的参考文档中,对ISession的描述如下:

    2022年7月26日
    10
  • Nginx配置Https并进行Http强制跳转Https

    Nginx配置Https并进行Http强制跳转Https

    2021年5月29日
    157

发表回复

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

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