美文网首页
简易版微信小程序跨页面传值

简易版微信小程序跨页面传值

作者: 不会吃鱼的小猫 | 来源:发表于2019-11-25 13:59 被阅读0次

1.定义一个eventBus.js

var list = {},
    listen,
    trigger,
    remove;

//监听事件函数
listen = function (key, fn) {
    if (!list[key]) {
        list[key] = []; //如果事件列表中还没有key值命名空间,创建
    }
    list[key].push(fn); //将回调函数推入对象的“键”对应的“值”回调数组
};

//触发事件函数
trigger = function () {
    var key = Array.prototype.shift.call(arguments); //第一个参数指定“键”
    var msg = list[key];
    if (!msg || msg.length === 0) {
        return false; //如果回调数组不存在或为空则返回false
    }
    for (var i = 0; i < msg.length; i++) {
        msg[i].apply(this, arguments); //循环回调数组执行回调函数
    }
};

//移除事件函数
remove = function (key, fn) {
    var msg = list[key];
    if (!msg) {
        return false; //事件不存在直接返回false
    }
    if (!fn) {
        delete list[key]; //如果没有后续参数,则删除整个回调数组
    } else {
        for (var i = 0; i < msg.length; i++) {
            if (fn === msg[i]) {
                msg.splice(i, 1); //删除特定回调数组中的回调函数
            }
        }
    }
};

module.exports = {
    listen: listen,
    send: trigger,
    remove: remove
}

2.定义时间module

/**
 * Data: 2018/06/15
 * Auth: Dongyunlong
 * Desc: eventModel
 */
var u = {};


//定义EVENT key
u.EVENT_SALE_CHOOSEGOODS = 'sale_choosegoods';                      //销售

module.exports = u;

3.在app.js中定义常量


var Event = require('./utils/event/EventBus.js'); //event Bus
var EventModel = require('./utils/event/EventModel.js'); //event


App({
    onLaunch: function (options) {
    },
    constants: {
        //事件
        Event: Event,
        EventModel: EventModel,
    }
})

4.页面中使用

const app = getApp();
const base = getApp().constants;


//在onLoad中
base.Event.listen(base.EventModel.EVENT_SALE_CHOOSEGOODS, function (res) {
  //...
})

//在onUnload函数中
base.Event.remove(base.EventModel.EVENT_SALE_CHOOSEGOODS);

//发送任意类型的数据
base.Event.send(base.EventModel.EVENT_SALE_CHOOSEGOODS, '我要发送的东西');

相关文章

  • 微信小程序 页面传值详解

    微信小程序 页面传值详解 一. 跨页面传值. 1 . 用 navigator标签传值或 wx.navigator,...

  • 简易版微信小程序跨页面传值

    1.定义一个eventBus.js 2.定义时间module 3.在app.js中定义常量 4.页面中使用

  • 微信小程序页面间的传值方式

    最新在学习微信小程序时联想到之前angular,vue在页面间的传值方式。想到小程序的几种页面间传值方式,于是总结...

  • 微信小程序自定义组件传值问题

    微信小程序自定义组件传值问题 自定义组件 · 小程序 父组件(引用组件的页面模板)页面 子组件页面 表示父组件页面...

  • 微信小程序_页面传值

    首先说点什么呢, 因为公司需求, 我也开始跳到小程序的坑里了, 填坑之路艰辛而凄凉, 好啦虽然有很多坑, 但毕竟小...

  • 微信小程序系列4——传值详解

    前言   在开发程序过程中,会遇到各种各样的传值的情景,例如:页面之间的传值、回调、代理、通知等。而在微信小程序中...

  • 关于微信小程序页面传值

    方向: 1,跨页面传值 2,input输入框值得获取方式 进程: 1,跨页面传值方式 ->借由navigatio...

  • 微信小程序页面间传值

    小程序传值的方式有正向传值和反向传值 正向传值:上一页面 --> 下一页面 url 传值 本地储存 全局的 app...

  • 微信小程序A,B页面传值

    今天,在做小程序的项目中,遇到了两个页面之间相互传值的问题. 有A,B两个页面,其中,B调用接口要传的参数id 是...

  • 微信小程序页面传值小探

    最近组里开发小程序,遇到了一个前端亘古不变的话题:页面传值刚开始使用路径传参解决,但是众所周知: 各浏览器HTTP...

网友评论

      本文标题:简易版微信小程序跨页面传值

      本文链接:https://www.haomeiwen.com/subject/ahodwctx.html