一、

<script>
export default {
name: 'HelloWorld'
}
$(function () {
alert('引入成功')
})
</script>

一、export的使用

比喻index.js要使用test.js中的数据,首先在test.js文件中进行导出操作

代码如下:

export function list()
{
alert("list");
} export function info()
{
alert("info");
} export let a=;

在index.js文件进行导入操作

代码如下:

<template>
<div>
<div v-show="show">HelloWorld</div>
<button @click="handleClick">Click</button>
</div>
</template> <script> import {list} from '@/components/common.js' export default {
name: "test",
data() {
return {
show: true
};
},
methods: {
handleClick: function() {
list();
}
}
};
</script>

2、export default的使用

test.js文件

index.js文件中:

注意:

一个js文件是可以有多个 export

但是一个js文件中只能有一个export default

五、vue中export和export default的使用的更多相关文章

  1. 关于VUE中 import 、 export 和 export default 的注意问题

    1.import引入一个依赖包,不需要相对路径.import 引入一个自己写的js文件,是需要相对路径的. 示例:import axios from ‘axios’; import AppServic ...

  2. vue 中import和export如何一起使用(一)

    前段时间碰到一个问题,vue js中要使用import来加载第三方的js,但是后面使用exports.XXX的话会报exports is not defined.那要怎么解决呢? 首先,我们要了解ES ...

  3. axios在Vue中的简单应用(一)

    1.安装axios: npm install --save axios vue-axios 2.安装qs: qs.stringify(data)可以解决data数据格式问题 npm install - ...

  4. Vue 中 export及export default的区别

    相信很多人都在vue使用过export.export default.import,然而它们到底有什么区别呢? 在ES6中,export与export default均可用于导出常量.函数.文件.模块 ...

  5. vue中export default 在console中是this.$vm

    vue中export default 在console中是this.$vm 用vue-cli搭出框架,用webstorm进行开发,参考vue2的官网进行教程学习, 在vue-cli中是用es6的exp ...

  6. 关于 vue中 export default 和 new Vue({})

    对于刚开始学习vue的人(像我),一般都不会清楚的知道两者之间该怎么区分,甚至觉得两者是一样的. 那么,经过我的查证,发现两者之间是没有任何联系的. export default ES6 Module ...

  7. Vue中 export default 和 export 区别

    1.export与export default均可用于导出常量.函数.文件.模块等2.在一个文件或模块中,export.import可以有多个,export default仅有一个3.通过export ...

  8. JavaScript ES6中,export与export default

    自述: 本来是对new Vue()和export default比较懵的,查了一下,发现我理解错了两者的关系,也没意识到export与export default的区别,先简单的记录一下基本概念,后续 ...

  9. vue中创建js文件使用export抛出函数,import引入后不能绑定HTML的问题

    在es6中使用export和import实现模块化: js文件: export function test(x) { console.log(x); } vue组件: import {test} fr ...

  10. es6中export、export default、import的理解

    export 与 import 的使用 export 与import是es6中新增模块功能最主要的两个命令.我们要知道在es6中,实现了模块功能,而且相当简单,意在取代commonjs和AMD规范.成 ...

随机推荐

  1. 使用 sed 命令查找和替换文件中的字符串的 16 个示例

    当你在使用文本文件时,很可能需要查找和替换文件中的字符串.sed 命令主要用于替换一个文件中的文本.在 Linux 中这可以通过使用 sed 命令和 awk 命令来完成. 在本教程中,我们将告诉你使用 ...

  2. leetcode 454 四数相加

    采用一个哈希表存储两个数的和,再遍历另外两个数组的和,time O(n2) space O(n2) class Solution { public: int fourSumCount(vector&l ...

  3. nodejs之express框架商品管理系统登录功能

    1.该系统主要使用express.body-parser.express-session.ejs.mongodb-connect . npm install express --save npm in ...

  4. 阶段3 2.Spring_07.银行转账案例_3 分析事务的问题并编写ConnectionUtils

    不是没有事务造成的 这样相当于有四个connection 每一个都有自己独立的事物 每一个自己成功就提交事务. 已经提交的就执行结束.没有提交的就报异常 让这些操作使用同一个connection 事物 ...

  5. Web08_MySQL&JDBC回顾

    数据库操作:DATABASE 查看正在使用的数据库: SELECT DATABASE(); 表操作:TABLE 修改表修改列明 ALTER TABLE 表名 CHANGE 旧列名 新列名 类型(长度) ...

  6. github创建项目,并提交本地文件

    1.如图所示,不要点选"Initialize this repository with README",不然就看不到第二幅图的提示信息了 2.根据下面提示,初始化本地文件,然后上传

  7. <数据结构系列3>队列的实现与变形(循环队列)

    数据结构第三课了,今天我们再介绍一种很常见的线性表——队列 就像它的名字,队列这种数据结构就如同生活中的排队一样,队首出队,队尾进队.以下一段是百度百科中对队列的解释: 队列是一种特殊的线性表,特殊之 ...

  8. HCL试验3

    PC端配置:配置ip地址 配置网关 交换机(左)配置:①创建VLAN system-view vlan 10 vlan 20 ②配置PC端接口 interface gi 1/0/1 port link ...

  9. [深度应用]·Keras极简实现Attention结构

    [深度应用]·Keras极简实现Attention结构 在上篇博客中笔者讲解来Attention结构的基本概念,在这篇博客使用Keras搭建一个基于Attention结构网络加深理解.. 1.生成数据 ...

  10. 暴力破解-H3C路由器-MSR900

    作者:zptxwd@gmail.com  最后修改日期2017年5月10日    转载请保留出处 声明,本文仅用于技术交流和学习,不得用于任何商业用途及违法行为.   所暴力破解的设备信息 华三路由器 ...