微信小程序使用export和import

举报
青年码农 发表于 2022/08/25 00:30:48 2022/08/25
【摘要】 小程序支持模块化开发,可以将一些公共的代码抽离成为一个单独的 js 文件,作为一个模块。模块只有通过 module.exports 或者 exports 才能对外暴露接口。引入模块通过require方式。 创建模块 function sayHello(name) { &nbsp...

小程序支持模块化开发,可以将一些公共的代码抽离成为一个单独的 js 文件,作为一个模块。模块只有通过 module.exports 或者 exports 才能对外暴露接口。引入模块通过require方式。

创建模块


   
  1. function sayHello(name) {
  2.   console.log(`Hello ${name} !`)
  3. }
  4. function sayGoodbye(name) {
  5.   console.log(`Goodbye ${name} !`)
  6. }
  7. module.exports.sayHello = sayHello
  8. exports.sayGoodbye = sayGoodbye

引入模块


   
  1. var common = require('common.js')
  2. Page({
  3.   helloMINA: function() {
  4.     common.sayHello('MINA')
  5.   },
  6.   goodbyeMINA: function() {
  7.     common.sayGoodbye('MINA')
  8.   }
  9. })

这是官方提供的方法,我个人还是比较喜欢使用export和import,使用起来比较顺手,可能是因为我一直用Vue开发的原因,下面拿一个实际例子,讲一讲export和import。

最近在开发的一个小程序项目,打算使用Promise对API这块做下封装,统一管理API请求。

新建request.js,提取公共请求路径


   
  1. // 公共路径
  2. const path = "http://172.16.50.83:82"

定义promise化接口


   
  1. /**
  2.  * promise化接口
  3.  */
  4. function wxRequest(url, method, params) {
  5.   return new Promise((resolve, reject) => {
  6.     wx.request({
  7.       url: path + url,
  8.       method: method,
  9.       data: params,
  10.       header: {
  11.         'content-type''application/json'
  12.       },
  13.       success: res => resolve(res),
  14.       fail: res => reject(res)
  15.     })
  16.   });
  17. }

登录接口


   
  1. function login(params = {}) {
  2.   return wxRequest('/wechatuser''post', params);
  3. }

导出


   
  1. // 导出
  2. module.exports = {
  3.   login
  4. }

上面这些代码都在一个文件中,完整代码就不展示了。

接下来就是导入新建接口文件,

import {login} from '../../api/request'
  

调用


   
  1. login().then(res=>{
  2.   console.log(res)
  3. })

注意一点的是,在引入模块时,要使用相对路径,如果使用绝对路径,在编译后会导致文件找不到。

文章来源: blog.csdn.net,作者:NMGWAP,版权归原作者所有,如需转载,请联系作者。

原文链接:blog.csdn.net/NMGWAP/article/details/125067070

【版权声明】本文为华为云社区用户转载文章,如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@huaweicloud.com
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。