对于想了解Vuex、axios、跨域请求处理和import/export的注意问题的读者，本文将是一篇不可错过的文章，我们将详细介绍vueaxios跨域请求实例，并且为您提供关于Axios、Passp
对于想了解Vuex、axios、跨域请求处理和 import/export 的注意问题的读者，本文将是一篇不可错过的文章，我们将详细介绍vue axios跨域请求实例，并且为您提供关于Axios、Passport 和 Express JS，无法保存跨域会话、es6 export, export default, import、ES6 导入导出 import、 export、 export default、ES6 模块导入import 导出export 和module.export的有价值信息。
本文目录一览：- Vuex、axios、跨域请求处理和 import/export 的注意问题（vue axios跨域请求实例）
- Axios、Passport 和 Express JS，无法保存跨域会话
- es6 export, export default, import
- ES6 导入导出 import、 export、 export default
- ES6 模块导入import 导出export 和module.export
Vuex、axios、跨域请求处理和 import/export 的注意问题（vue axios跨域请求实例）
一、Vuex
1、介绍
vuex是一个专门为Vue.js设计的集中式状态管理架构。
对于状态，我们把它理解为在data中需要共享给其他组件使用的部分数据。
Vuex和单纯的全局对象有以下不同：
1. Vuex 的状态存储是响应式的。当vue组件从store中读取状态的时候，
若store中的状态发生变化，那么相应的组件也会相应的得到高效更新。
2. 你不能直接改变store中的状态。改变store中的状态的唯一途径就是显示的
提交(commit)mutation。这样使得我们可以方便的跟踪每一个状态的变化，
从而让我们能够实现一些工具来帮助我们更好的了解我们的应用。
2、vuex 的安装和实例化
1. 安装命令
-- npm install vuex
2. 实例化的两种方式
方式一：直接在main.js里面注册vuex的仓库实例
// main.js
import Vue from ''vue''
import App from ''./App''
import Vuex from ''vuex''
// 让vue实例使用Vuex
Vue.use(Vuex)
Vue.config.productionTip = false
// 实例化Vuex的仓库，store代表仓库
const store = new Vuex.Store({
// state存放所有的公用数据
state: {
name : "bdyjy",
}
});
new Vue({
el: ''#app'',
// 注册store: store
store,
components: { App },
template: ''<App/>''
});
方式二：为了方便维护，通常在src下面新建一个store文件夹，然后在里面新建一个index.js
// store/index.js
import Vuex from "vuex"
import Vue from "vue"
Vue.use(Vuex);
// 抛出实例化的Vuex仓库，store代表仓库
export default new Vuex.Store({
// state存放所有的公用数据
state: {
name : "bdyjy",
}
})
// main.js
import Vue from ''vue''
import App from ''./App''
import store from "./store/index"
Vue.config.productionTip = false
new Vue({
el: ''#app'',
// 注册store: store
store,
components: { App },
template: ''<App/>''
});
3、获取数据
1. state
state是保存我们data中需要共享的数据。
由于Vuex的存储是响应式的，从store实例中读取状态可以使用：this.$store.state.变量名
且应该在计算属性中返回某个状态，因为计算属性实时在监听数据，数据变化了，它立刻就能知道，
如果在data属性中返回某个状态，那么这个数据如果在后续变化了，它也不知道了，因为data在加载完成后就不会再监听这个数据
示例：在某个组件中使用
// course.vue
<template>
<div>
<h2>这是课程组件</h2>
<p>我是{{name}}</p>
</div>
</template>
<script>
export default {
name: "Course",
// 使用计算属性获取仓库里面的name变量的值
computed: {
name: function () {
return this.$store.state.name
}
}
}
</script>
2. getters
有时候我们需要从store中的state中派生出一些状态，例如对数据进行简单的计算。
并且很多组件都需要用到此方法，我们要么复制这个函数，要么抽取到一个公共函数，多处导入。
我们vuex提供了更加方便的方法，getters 它就像计算属性一样，getters的返回值会根据它的依赖被
缓存起来，只有它的依赖发生改变时，才会重新计算。
简单地来说，getters可以对状态进行二次处理
1. // store/index.js
import Vuex from "vuex"
import Vue from "vue"
Vue.use(Vuex);
// 抛出实例化的Vuex仓库，store代表仓库
export default new Vuex.Store({
// state存放所有的公用数据
state: {
name : "bdyjy",
},
// getters对state的值进行二次处理
getters: {
friend: function (state) {// 接收state作为参数
return state.name + ''的朋友是:jty''
}
}
})
2. // 在某个组件中使用
// course.vue
<template>
<div>
<h2>这是课程组件</h2>
<p>我是{{name}}</p>
<p>{{friend}}</p>
</div>
</template>
<script>
export default {
name: "Course",
computed: {
name: function () {// 通过state取值
return this.$store.state.name
},
friend: function () {// 通过getters取值
return this.$store.getters.friend
}
}
}
</script>
1. // store/index.js
import Vuex from "vuex"
import Vue from "vue"
Vue.use(Vuex);
// 抛出实例化的Vuex仓库，store代表仓库
export default new Vuex.Store({
// state存放所有的公用数据
state: {
name : "bdyjy",
},
// getters对state的值进行二次处理
getters: {
friend: function (state) {// 接收state作为参数
return state.name + ''的朋友是:jty''
},
play: function (state, getters) {// 接收state和getters作为参数
// 因为要取到friend，就要state
return getters.friend + ''一起玩''
}
}
})
2. // 在某个组件中使用
// course.vue
<template>
<div>
<h2>这是课程组件</h2>
<p>我是{{name}}</p>
<p>{{friend}}</p>
<p>{{play}}</p>
</div>
</template>
<script>
export default {
name: "Course",
computed: {
name: function () {// 通过state取值
return this.$store.state.name
},
friend: function () {// 通过getters取值
return this.$store.getters.friend
},
play: function () {
return this.$store.getters.play
}
}
}
</script>
4、更改 store 中的状态
1. 回想一下非父子之间的组件之间是如何进行通信的
-- 新建一个新的vue实例当做两个组件之间通信的桥梁
-- 一个组件使用 $emit 向这个vue实例提交事件
-- 另一个组件在加载完成后这个vue实例通过钩子函数mounted 使用 $on 监听$emit提交的事件然后处理
2. vuex 更改 store 中的状态类似于上面的步骤
-- 通过this.$store.commit(''事件名称'', ''数据'')提交事件到这个vuex仓库
-- 在Vuex.Store这个实例里面通过mutations接收提交过来的事件
-- mutations里面的事件它会接收state为第一个参数，后面接收其他参数
3. 示例
<template>
<div>
<h2>这是学位课程信息</h2>
<button @click="my_click">点击展示学位信息</button>
<h3>{{degree_info}}</h3>
</div>
</template>
<script>
export default {
name: "DegreeCourse",
computed: {
degree_info: function () {
return this.$store.state.degree_info
}
},
methods: {
// 提交事件到store
my_click: function () {
this.$store.commit(''degree_info'', ''博士'')
}
}
}
</script>
import Vuex from "vuex"
import Vue from "vue"
Vue.use(Vuex);
// 抛出实例化的Vuex仓库，store代表仓库
export default new Vuex.Store({
state: {
degree_info: ''''
},
// commit上来的事件在这里进行处理
mutations: {
degree_info: function (state, data) {
state.degree_info = data
}
}
})
二、axios 的简单使用
1、安装
使用npm安装axios
-- npm install axios
axios是基于promise用于浏览器和node.js的http客户端
2、axios 基本参数
url:请求接口地址
method:请求方式
data:请求数据
headers:请求头
then(function(response){}):请求成功后的回调函数
catch(function(error){})请求失败后的回调函数
1.发送ajax请求
$.ajax({})
参数：
url: 提交到哪个URL地址
type: 提交的方式
data: {你要发送的数据}
success: function (res) {
请求发送过去，被正常响应后执行的函数，res是后端返回来的数据
}
error: function (err) {
请求发送过去，响应失败时执行的函数
}
2.示例
$.ajax({
url: ''/regirest/'',
type: ''POST'',
data: {
username: ''xxx'',
},
success: function (res) {
console.log(res)
}
})
3、几种请求方法
1. get 请求
// 携带参数的get请求
axios.get(''/user?ID=12345'')
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
// 上面的请求可以这样做
axios.get(''/user'', {
params: {
ID: 12345
}
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
2. post 请求
axios.post(''/user'', {
username: ''xiaoming'',
password: ''123abcd''
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
3. 执行多个并发请求
function getUserAccount() {
return axios.get(''/user/12345'');
}
function getUserPermissions() {
return axios.get(''/user/12345/permissions'');
}
axios.all([getUserAccount(), getUserPermissions()])
.then().catch();
4. axios.request (推荐使用这种)
axios.request({
method: ''post'', // 请求方式:get、post、delete等等
url: ''/user/12345'',
data: {
username: ''xiaoming'',
password: ''123abcd''
}
});
4、示例
1. 把 axios 设置成 Vue 对象属性
下载好axios后，在需要使用的地方导入axios即可直接使用，axios类似于ajax，用于向后端进行数据传输
但是axios是不能注册到Vue实例里面，因此不能通过this.$axios进行使用的，因为它不是Vue实例的属性，
但是我们就是希望能够通过this.$axios对它进行使用呢，可以给Vue的原型链prototype增加一个$axios属性，
然后所有的Vue对象都可以通过this.$axios对它进行使用
// main.js
import axios from "axios"
Vue.prototype.$axios = axios
2. Vue 代码
<script>
export default {
name: "DegreeCourse",
mounted(){
this.$axios.request({
url: "http://127.0.0.1:8000/test/", // 后端地址
method: "get" // 提交方式
}).then(function (response) {// then是成功后的回调函数
console.log(response);
}).catch(function (error) {// catch是失败后的回调函数
console.log(error);
})
}
}
</script>
3. 浏览器的同源策略
当这个组件加载完后，会自动向后端http://127.0.0.1:8000/test/ 发送 get 请求，
但是这样发送的请求是属于跨域请求，由于浏览器的同源策略，服务器给我们返回的信息浏览器会给我们拦截下来，
所以如果后端返回消息的时候不进行一些处理的话，前端这里是收不到消息的并且会报错。(前后端的域名和端口只要其中一个不一样，就是跨域)，
跨域的ajax请求就会被浏览器拦截(axios发送的也是ajax请求)。
那怎么处理？继续往下看..
三、CORS 跨域请求介绍
1、区分简单请求和复杂请求
HTTP方法是下列方法之一
HEAD， GET，POST
HTTP头信息不超出以下几种字段
Accept， Accept-Language， Content-Language， Last-Event-ID
Content-Type只能是下列类型中的一个
application/x-www-from-urlencoded
multipart/form-data
text/plain
任何一个不满足上述要求的请求，即会被认为是复杂请求
复杂请求会先发出一个预请求，我们也叫预检，OPTIONS请求
也就是说，HEAD， GET，POST这三个请求，当它们满足上面的头信息时，它们就是简单请求，否则都是复杂请求，
比如一个get请求，但是它请求头的Content-Type是application/json类型，那么它也是复杂请求。
复杂请求会先发出一个OPTIONS预请求。
2、请求头
Accept
我能解析什么数据类型
ContentType
我给你的是什么数据类型
数据类型
application/x-www-from-urlencoded --> form表单
multipart/form-data --> 文件格式
text/plain --> 文本
application/json --> json格式
html
xml
四、跨域请求处理 --jsonp
1、 原理 (现在很少有人使用这种方式处理跨域请求)
我们可以发现，我们使用CDN引进任何链接的时候，引进了就可以使用了，但是，CDN的链接对于我们来说也是跨域，为什么不会报错呢？
原因是对于script、link或img这些标签，他们引入CDN只是发送get请求获取资源，浏览器认为这没有风险，所以可以正常进行请求，
而ajax可以发送任何类型的请求，风险太大，浏览器就自动把它们拦截了(浏览器只阻止表单以及ajax请求)。
比如script标签src想某个CDN发送get请求，拿到的所有资源就会存在script标签内，你就可以在script标签内使用这些内容。
2、示例
// 某前端页面代码
<script>
// 定义一个函数
function handlerResponse(data) {
console.log(data)
}
</script>
// 向后端发送请求，拿到handlerResponse函数并执行
<script src="http://127.0.0.1:8000/test/"></script>
// 某Django后端代码
class TestView(views.View):
def get(self, request):
# 返回一个handlerResponse("ok")字符串
return HttpResponse(''handlerResponse("ok")'')
五、CORS 跨域请求之简单请求处理
1、 get 跨域简单请求
1. 报错原因
Access-Control-Allow-Origin --> 前端这个域不被允许接收后端的数据
2. 后端视图函数
class TestView(views.View):
def get(self, request):
return HttpResponse(''嘿嘿'')
3. 后端中间件
from django.utils.deprecation import MiddlewareMixin
class MyCores(MiddlewareMixin):
def process_response(self, request, response):
# 给这个响应添加响应头
# 告诉浏览器我这个后端允许响应头指定的域拿到我的响应数据(*代表所有域)
response[''Access-Control-Allow-Origin''] = ''*''
# http://localhost:8080代表只能让这个域拿到我的数据
# response[''Access-Control-Allow-Origin''] = ''http://localhost:8080''
return response
4. 前端 Vue
<script>
export default {
name: "DegreeCourse",
mounted(){
this.$axios.request({
url: "http://127.0.0.1:8000/test/", // 后端地址
method: "get" // get简单请求
// method: "post" // post简单请求
}).then(function (response) {// then是成功后的回调函数
console.log(response); // 接收到后端response的数据是一个对象
}).catch(function (error) {// catch是失败后的回调函数
console.log(error);
})
}
}
</script>
2、 post 跨域简单请求
注意：前后端分离的项目没办法提交csrf，有些框架是可以默认过滤跳过这个验证，现在的话，我们先在后端把csrf中间件注释掉
代码跟上面一样，只是在前端把method的提交方式改成post即可
六、CORS 跨域请求之复杂请求处理
1、delete 跨域复杂请求
1. 报错原因
Access-Control-Allow-Methods --> 这个请求方法不被允许
2. 后端视图函数
class TestView(views.View):
def delete(self, request):
return HttpResponse("返回DELETE数据")
3. 后端中间件
class MyCores(MiddlewareMixin):
def process_response(self, request, response):
# 给这个响应添加响应头
# 告诉浏览器我这个后端允许响应头指定的域拿到我的响应数据(*代表所有域)
response[''Access-Control-Allow-Origin''] = ''*''
# http://localhost:8080代表只能让这个域拿到我的数据
# response[''Access-Control-Allow-Origin''] = ''http://localhost:8080''
# 如果是复杂请求，会先发送OPTIONS预检
if request.method == ''OPTIONS'':
# 如果是复杂请求的方法不被允许，那么就给告诉浏览器我允许这个复杂请求
response["Access-Control-Allow-Methods"] = "DELETE"
return response
4. 前端 Vue
<script>
export default {
name: "DegreeCourse",
mounted(){
this.$axios.request({
url: "http://127.0.0.1:8000/test/", // 后端地址
method: ''delete'' // delete复杂请求
}).then(function (response) {// then是成功后的回调函数
console.log(response); // 接收到后端response的数据是一个对象
}).catch(function (error) {// catch是失败后的回调函数
console.log(error);
});
}
}
</script>
2、post 发送复杂请求
1. 报错原因
Access-Control-Allow-Headers --> 这个请求头的数据类型不被允许
2. 后端视图函数
class TestView(views.View):
def post(self, request):
return HttpResponse("返回POST数据")
3. 后端中间件
class MyCores(MiddlewareMixin):
def process_response(self, request, response):
# 给这个响应添加响应头
# 告诉浏览器我这个后端允许响应头指定的域拿到我的响应数据(*代表所有域)
response[''Access-Control-Allow-Origin''] = ''*''
# http://localhost:8080代表只能让这个域拿到我的数据
# response[''Access-Control-Allow-Origin''] = ''http://localhost:8080''
# 如果是复杂请求，会先发送OPTIONS预检
if request.method == ''OPTIONS'':
# 如果是复杂请求的方法不被允许，那么就给告诉浏览器我允许这个复杂请求
response["Access-Control-Allow-Methods"] = "DELETE"
# 告诉浏览器这个请求头的数据类型我是允许的
response["Access-Control-Allow-Headers"] = "Content-Type"
return response
4. 前端 Vue
<script>
export default {
name: "DegreeCourse",
mounted(){
this.$axios.request({
url: "http://127.0.0.1:8000/test/", // 后端地址
method: ''post'', // post发送复杂请求
contentType: "application/json",
data: {
"author": "狗屎"
}
}).then(function (response) {// then是成功后的回调函数
console.log(response); // 接收到后端response的数据是一个对象
}).catch(function (error) {// catch是失败后的回调函数
console.log(error);
})
}
}
</script>
3、总结
-- 复杂请求什么不被允许，那么我们就在中间件给它设置成是允许的即可
-- 前端拿到的响应数据是一个对象，具体的值存在这个对象的data属性里面，取值：响应对象.data
-- 响应对象还有其他数据：
config: {...}
data: "后端返回的具体数据"
headers: {content-type: "text/html; charset=utf-8"}
request: XMLHttpRequest {…}
status: 200
statusText: "OK"
七、VUE 中 import 、export 的注意事项
1、导包的问题
1. import引入一个依赖包，不需要相对路径
示例：import axios from ''axios'';
2. import 引入一个自己写的js文件，是需要相对路径的
import AppService from ''./appService'';
2、export import 注意事项
"""
import什么情况下，要用{}的方式引入，
什么情况下，只需要一个变量就行。
"""
1. 使用export抛出的变量需要用{}进行import引入
# a.js
let name = "xiaoming";
let age = 18;
export {name, age}
# b.js
import {name, age} from "./a.js"
2. 使用export default抛出的变量，只需要自己起一个名字就行
# a.js
var obj = { name: ''狗明'' };
export default obj;
# b.js
import aaa from ''./a.js'';
console.log(aaa.name); // ''狗明''
3. 注意
一个js文件中，只能有一个export default，但是可以有多个export
Axios、Passport 和 Express JS，无法保存跨域会话
如何解决Axios、Passport 和 Express JS，无法保存跨域会话？
我正在构建一个以 Vue 作为前端和 Express JS 作为后端的应用程序。我正在尝试使用 Passport JS 制作用户登录功能。目前，身份验证有效，但会话存储无效。
我已经花了 天 试图使这项工作发挥作用。目前，问题似乎来自跨域请求。 我的前端在端口 80，我的后端在端口 3000。
我所有的请求都是在“withCredentials”设置为 true 的情况下提出的，我读到这是传递会话的唯一方法。在后端，我使用 cors 模块来处理跨域请求。
app.use(cors({
origin: [''http://localhost:80'',''http://localhost'',''http://localhost:3000''],credentials: true,exposedHeaders: [''set-cookie'']
}));
当我实际尝试登录时，我只是收到错误 Credential is not supported if the CORS header ‘Access-Control-Allow-Origin’ is ‘*’。如果我查看检查器选项卡中发送的请求，我会发现在我的 POST 请求之前，发送了一个 OPTION 请求，其中包含错误的标头。
我尝试以各种可能的方式设置它，但它永远不会奏效。在这一点上，我什至不知道出了什么问题。这是发送请求的前端代码和处理请求的后端代码。我做了很多修改，我什至不知道这是否正确。
发送请求的前端
const instance = axios.create({
baseURL: "http://localhost:3000/api",headers: {
"Content-type": "application/json","Access-Control-Allow-Origin": ''http://localhost:80'',"Access-Control-Allow-Credentials": "true"
},withCredentials: true
});
http.post("/login",this.input,{
headers: {
"Content-type": "application/json","Access-Control-Allow-Credentials": "true"
}
})
.then((response) => {
// Handle the result and catch errors
});
后台处理登录请求
app.options(path,(req,res) => {
res.setHeader("Access-Control-Allow-Origin","http://localhost:80");
res.setHeader("Access-Control-Allow-Credentials","true");
req.setHeader("Access-Control-Allow-Origin","http://localhost:80");
req.setHeader("Access-Control-Allow-Credentials","true");
});
app.post(path,res,next) => {
console.log(''Connection'');
passport.authenticate(''local'',{},(err,user,info) => {
console.log(user);
if (user) {
req.login();
} else {
res.send(err);
}
})(req,next);
});
如果有人能帮忙解决这个问题，将不胜感激
解决方法
暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！
如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@）
es6 export, export default, import
JavaScript ES6中export、import与export default的用法和区别https://www.jb51.net/article/108418.htm
总结：
export和export default都是对外暴露成员，两者可以同时存在
export default只能有一个，其他地方引入时可以直接指定别名 import Vue from 'vue'
export 可以向外暴露多个成员，其他地方引入时必须严格按照导出时候的的名称来使用{ } 按需接收 import {mapGetters} from 'vuex'
// a.js
export default "some data";
// b.js
import PrivateKey from "./a.js";
// a.js
export const someValue = "some data";
// b.js
import { someValue as PrivateKey } from "./a.js";
ES6 导入导出 import、 export、 export default
按照模块化开发时，每一个JS文件都是一个自己的空间，有单独的模块作用域
1.export的基本使用 统一导出
export导出：
let name = "小明";
let age = "20";
function sum(num1,num2){
return num1+num2;
}
// 大括号内的变量名，必须跟 export 对外接口的变量名一致
export{name,age,sum} // 导出
import导入：
// 大括号内的变量名，必须跟 export 对外接口的变量名一致
import {name,age,sum} from "导出文件的地址"
console.log(name); //小明
console.log(age); //20
console.log(sum(1,2)); //3
//导入的时候，可以使用 as 关键字给模块定义别名
//import {name as myname,age,sum} from "导出文件的地址"
注意：
如果使用了这种一个个导出的方式 export{name,age,sum} ,导入的时候就不能使用整体导入的方式import aa from "导出文件的地址",不然会报错 undefined
应该使用 按需导入的形式 import {a,b} from "导出文件的地址"
2.export的基本使用 单独导出
export let num1 = 1000;
import {num1 } from "导出文件的地址"
console.log(num1 ); //1000;
3.导出函数、类
// 导出函数
export function sum(num1,num2){
return num1+num2;
}
import {sum} from "导出文件的地址"
console.log(sum(1,2)); //3
类：
// 导出类
export class Person{
run(){
console.log("在奔跑");
}
}
// 导入类
import {Person} from "导出文件的地址"
const P = new Person();
P.run(); //在奔跑
4.export default
某些时候，一个模块包含某个功能，我们并不希望给这个功能命名，而是让导入者可以自己来命名，这个时候就可以用export default
在同一个模块中只能有一个export default
此时可以自定义导入变量的名字，下面的案例中，就可以自定义address的名字
当使用default时，import后面不需要大括号，直接默认导入default后面的变量，且可以自定义名字
//导出
var address = "北京市";
export default address;
//导入
import addr from "导出文件的地址" //函数在加载时，可以以任意名字来加载
console.log(addr) //北京市
//导出函数
export default function(value){ // 此时函数未命名
console.log(value)
}
//导入
import addr from "导出文件的地址" //函数在加载时，可以以任意名字来加载
console.log（addr('你好啊'); ）; /// 此时返回‘你好啊’
//注意：一次只能导出一个,多个可以放在对象中
function mapFilter(){
console.log('111')
}
function mapModule(){
console.log('222')
}
var obj={
mapFilter,
mapModule,
}
export default obj
import obj from '@/导出文件地址' es6导入
5.统一全部导入
import {age,name,age} from "导出文件地址"
import * as aaa from "导出文件地址"，console.log(aaa.age);
6.export default 和 export 区别
1、export与export default均可用于导出常量、函数、文件、模块等
2、你可以在其它文件或模块中通过import+(常量 | 函数 | 文件 | 模块)名的方式，将其导入，以便能够对其进行使用
3、在一个文件或模块中，export、import可以有多个，export default仅有一个
4、通过export方式导出，在导入时要加{ }，export default则不需要
5、使用export 导出后，import 可以按需导入，减小项目大小，而 export default 是全部导入，开发中更推荐 export
ES6 模块导入import 导出export 和module.export
ES6中新增了模块的导入和导出功能
在实际过程中可以使用 import 和 export 对模块进行导入和导出操作，具体如下
1. 名字导入/导出 （导入名字必须与导出的一致，导入时需要用花括号）
//------ lib.js ------
export const sqrt = Math.sqrt;
export function square(x) {
return x * x;
}
export function add (x, y) {
return x + y;
}2 . 导入时也可以用 * ，导入整个文件
//------ main.js ------
import * as lib from lib.js
console.log(lib.sqrt)
console.log(lib.add)3. 默认导出，每个模块可以有一个默认导出，这样导入时的名字可以与导出不一致
/* Store实例 */
export default new Vuex.Store({
state,
getters,
actions,
mutations
})import store from ''./store/''在 import 的时候 如果不使用相对路径或者绝对路径，node默认会去node_modules/文件夹下去找
关于Vuex、axios、跨域请求处理和 import/export 的注意问题和vue axios跨域请求实例的问题就给大家分享到这里，感谢你花时间阅读本站内容，更多关于Axios、Passport 和 Express JS，无法保存跨域会话、es6 export, export default, import、ES6 导入导出 import、 export、 export default、ES6 模块导入import 导出export 和module.export等相关知识的信息别忘了在本站进行查找喔。
本文标签：
