微信小程序的模块化开发，提高效率第一篇

一，为什么使用模块化，什么时候使用，二，使用的体会，三，怎么使用模块化

1.图片预览

2.用户登录状态

3.弹框

4.页面跳转

二，使用的问题

页面传参的问题，参数的传入，传出，以及保存，

使用return，的方式

个人简单的实践原理，进行函数的封装，需要的时候调这个js就好

1.ceshi.js

//函数

function getAreaInfo() {

var data = [{'id':1},{'id':2}];

console.log(1)

}

//数据

var data = [{ 'id': 1 }, { 'id': 2 }];

module.exports.data = data

exports.getAreaInfo = getAreaInfo

2.index.js

//引入

const util = require('../../utils/ceshi.js')

onLoad:function(){

util.getAreaInfo()

console.log(util.data)

}

输出的结果

微信官方的

模块化

可以将一些公共的代码抽离成为一个单独的 js 文件，作为一个模块。模块只有通过 module.exports 或者 exports 才能对外暴露接口。

需要注意的是：

exports 是 module.exports 的一个引用，因此在模块里边随意更改 exports 的指向会造成未知的错误。所以更推荐开发者采用 module.exports 来暴露模块接口，除非你已经清晰知道这两者的关系。
小程序目前不支持直接引入 node_modules , 开发者需要使用到 node_modules 时候建议拷贝出相关的代码到小程序的目录中。

// common.js
function sayHello(name) {console.log(`Hello ${name} !`)
}
function sayGoodbye(name) {console.log(`Goodbye ${name} !`)
}module.exports.sayHello = sayHello
exports.sayGoodbye = sayGoodbye

在需要使用这些模块的文件中，使用 require(path) 将公共代码引入

var common = require('common.js')
Page({helloMINA: function() {common.sayHello('MINA')},goodbyeMINA: function() {common.sayGoodbye('MINA')}
})

Tips

tip: require 暂时不支持绝对路径

微信小程序的模块化开发，提高效率第一篇相关推荐

微信小程序安装与开发步骤
微信小程序安装与开发步骤 1.登陆 :微信专有开发工具安装地址如图:我选择的是稳定版,64位安装完成后如图: 图 2 . 2.新建第一个小程序 2.1 申请 AppID 登陆https://mp ...
李艺《微信小程序全栈开发实战》（第一章）
李艺<微信小程序全栈开发实战>(第一章) 双线程运行机制小程序的特点及开发能力小程序的特点小程序的开发能力开发小程序的一般流程小程序的运行机制小程序双线程视图的持续更新是如何 ...
微信小程序经典案例开发(微信开发)
课程介绍: 非常值得推荐的一套微信小程序开发视频教程,来自极客学院全套的微信实战开发程序,值得学习 -------------------课程目录------------------- ├<; ...
2018最新微信小程序经典案例开发视频教程合集
课程介绍: 非常值得推荐的一套微信小程序开发视频教程,来自极客学院全套的微信实战开发程序,值得学习 -------------------课程目录------------------- ├<; ...
另一个小程序返回的支付结果如何得到_微信小程序商城的开发商家需要注意什么？...
原标题:微信小程序商城的开发商家需要注意什么? 小程序的应用目前已经成为人们使用较为普遍的平台,无论是用于吃喝玩乐亦或是工具.商业发展等.微信作为小程序的首家推出平台,凭借其自身的10亿流量用户让小程 ...
微信小程序直播间开发抽红包功能
1.前言微信小程序直播间开发抽红包功能微信小程序直播是微信官方提供的商家经营工具,商家可通过在小程序内直播实现用户互动与商品销售的闭环,无需任何的跳转,提高下单转化率,直播更是成为链接商家和消费者 ...
微信小程序应用号开发教程！博卡君通宵吐血赶稿
微信应用号(微信公众平台小程序,「应用号」的新称呼)终于来了!开源中国社区的博卡君通宵吐血赶稿写出的微信公众平台应用号开发教程!大家赶紧来学习一下吧对了,昨天晚间微信小程序开发文档官方版发布了微信 ...
微信小程序组件库开发记录
微信小程序组件库开发记录背景前言技术选型环境搭建安装 gulp 将`scss`编译为`wxss` 压缩`wxml`,`js`,`json`文件和图片拷贝文件到另一个目录删除目录整合创 ...
微信小程序开发登录界面mysql_微信小程序欢迎界面开发的实例详解
微信小程序欢迎界面市面上大多数的app都会有一个欢迎界面,下面将演示如何通过微信小程序实现一个欢迎界面. 下面将会按照以下的顺序介绍: 布局的实现逻辑的实现样式的实现 1.布局的实现整个布局 ...
微信小程序image组件开发程序以及相关图片问题参考资料汇总
微信小程序image组件开发程序以及相关图片问题参考资料汇总,希望对大家小程序开发能有一定的参考和借鉴价值.以下汇总主要涉及到微信小程序image组件有关资源路径.缩放和剪裁模式等进行的探讨,无论是对 ...

微信小程序的模块化开发，提高效率第一篇

Tips

微信小程序的模块化开发，提高效率第一篇相关推荐

最新文章

热门文章