export default / export const

export default 是默认导出
export const 是命名导出

参考:Javascript (ES6), export const vs export default(基本上就是翻译这篇)

在一个vue文件中export const可以有多个,但是export default只有且仅有一个,{}表示导入非默认变量 , 也就是说文件中不使用export default导出的变量就需要加{}, 使用export default导出的就可以不加花括号

//demo1.js
// a
export const a = (params) => {
return axios({
method: 'post',
url: '/api/a/b.json',
data: qs.stringify(params)
})
}
// b
export const b= (params) => {
return axios({
method: 'post',
url: '/api/a/b.json',
data: qs.stringify(params)
})
}

// c
export const c= (params) => {
return axios({
method: 'post',
url: '/api/a/b.json',
data: qs.stringify(params)
})
}
在vue页面中可以引用多个

import {a} from 'demo1'



import {b} from 'demo1'



import {c} from 'demo1'





import {a,b,c} from 'demo1'

export default的使用为:

//demo.vue

export default {

        name: 'index',

        data() {

            return {

                menuDataLimit:{},

//                展示1

                todaySituation: {

                    orderNum1: '',

                    price1: '',

                    buyNum1: '',

                    buyPrice1: ''

                },

//                展示2

                wholeSituation: {

                    orderNum2: '',

                    price2: '',

                    buyNum2: '',

                    buyPrice2: ''

                }

          }

       }

}

当然,这里是直接在页面中写的,如果是外部引用的话,是这样:

import dea from 'demo1' //导入的时候可以给这个模块任意取名字,且不需要用花括号

 

posted @ 2019-09-24 19:00  梅子~  阅读(10522)  评论(1编辑  收藏  举报