用户
 找回密码
 立即注册

QQ登录

只需一步,快速开始

扫一扫,登录网站

2017-3-25 16:42:50 天下雪原创达人 造轮子 人生巅峰 楼主 413197
这个东西,是开发小程序必备神器,越深入了解,越可以有效的帮助自己;所以我将部分知识聚合一下,以便帮助大家;
假如有文章是错误或者不适用的,欢迎指出,以便更正!欢迎大家在学习本帖后,实践并分享自己在传值方面的实践心得!

相关文章:

微信小程序多页面传参通信的探索与实践
微信小程序wx:for的使用,动态传参
小程序页面间通信的5种方式
微信小程序小工具之页面跳转传值
微信小程序_页面传值
小程序中子页面向父页面传值实例
微信小程序:tabbar未显示,页面之间传参,picker组件取值
微信小程序链接传参,跳转新页面
微信小程序实现跳转传参
微信小程序页面传值
微信小程序取值传值方式小结
微信小程序学习笔记《一》:页面的生命周期与参数传递
小程序页面跳转和跳转时的数据传递
多个页面共享一套数据,父页面传递参数给子页面
页面之间的参数传递,编辑完当前页面返回数据到上一页更新
小程序踩坑记《三》复杂数据的传递
小程序踩坑记《二》页面关闭数据传递
带参传递的界面跳转的两种方式
页面之间的跳转方式【路由】和参数传递
微信小程序从子页面退回父页面时的数据传递
微信小程序页面跳转传递值
微信小程序之数据传递
微信小程序-参数传递与事件处理
微信小程序页面跳转和参数传递
微信小程序开发:list跳转带值传递
微信小程序试水教程:参数传递
微信小程序跳转传参数 传对象
navigator 跳转url传递参数,bindtap等事件传参
微信小程序数据绑定以及跳转传参
页面间跳转如何监听事件



相关组件:
微信小程序类似于iOS通知中心。做到1对多发消息,传值
holdnoListener 微信小程序事件订阅及广播:跨页面传参
wx-cross-page-communication:微信小程序跨页面通讯
微信小程序不同页面间的消息传递
如何在微信小程序里面实现跨页面通信?

EBus-JS:使用纯js编写的事件通知机制工具
微信小程序页面通讯以及组件化
微信小程序中实现一对多发消息

相关demo:
日程提醒(页面之间数据传递)
棒棒达寄件平台:参数传递,城市三级联动
微信小程序学习用demo:页面通信及传值



相关讨论:
template传值问题
页面之间传值,大家都是用什么方法?
请求成功,如何带传参跳转

相关讨论:
使用navigateBack 返回上一页,能否刷新上一页的页面或传值到上一页如题,我在做选择地址的时候, 弹出一个新的页面吧地址列表呈现出来,地址列表中选择地址后,关闭当前页面,刷新上级页面。应该如何实现呢
utils.js
[AppleScript] 纯文本查看 复制代码
function getPrevPage() {
var pages = getCurrentPages();
var prevPage = pages[pages.length - 2];//上一个页面
return prevPage;
}



然后在你的返回界面调用getPrevPage()方法,得到上一个页面直接设置即可,如:
[AppleScript] 纯文本查看 复制代码
var prev = util.getPrevPage()
prev.setData({
A: 1234
})

或者调用方法
[AppleScript] 纯文本查看 复制代码
prev.search()


相关讨论:
模板传值问题 template模板中写了循环时,循环内部可以调用外部的值

但是如果动态改变循环数组的值,内部调用的外部值将被清空

[AppleScript] 纯文本查看 复制代码
<template is="testName" data="{{...testData}}" />
 
<template name="testName">
    <view bindtap="testChange">
    {{key1}}
    <block wx:for="{{key2}}" wx:key="*this">
        {{key1}}
        {{item}}
    </block>
    </view>
</template>


[AppleScript] 纯文本查看 复制代码
var pageData = {
    data: {
        testData: {'key1': 'value1', 'key2': ['value2_1','value2_2']}
    },
    testChange: function(){
        this.setData({
            testData: {'key1': 'value1', 'key2': ['value2_3','value2_4']}
        })
    }
}


页面先显示
value1 value1 value2_1 value2_2

点击后触发testChange事件,内容变为
value1 value2_3 value2_4

问题来了
循环内部写的{{key1}}跑哪了?

把外部数据用setData方法试试

[AppleScript] 纯文本查看 复制代码
that.setData({
变量名:外部数据
})


我遇到一个差不多的,这样解决了


相关讨论:
微信小程序反向传值怎么做?

点击列表  把数组的第N个带回来显示   怎么做
如果是点击列表第n项显示数组第n项的话,可以这样实现。
把数据保存起来,给列表加监听事件,当第n项被点击时去取数组对应的项就行了


感谢,我存本地了
相关讨论:
拨打电话号码怎么传递?

wx.scanCode({
        success: (res) => {
    console.log(res.result)

得到扫描数据了,如何传递给“12345”

wx.makePhoneCall({
  phoneNumber: '12345'//
})
wx.scanCode({
   success: (res) => {
    console.log(res.result)
    wx.makePhoneCall({
    phoneNumber : res.result,
     })
   }
})


相关讨论:
当前页面的值如何传递到上个页面

点击返回按钮时,如何将当前页面data里的值传递到返回的页面???用wx.navigateBack()方法嘛??
一个简单的方法就是用app.js中的公共数据。

在一个操作时再app.js中的globalData,设置一个值,然后在另一个操作中再从globalData取值。

globalData是自己在app.js中设置的数据object,里面的数据自定义。


可以将数据存起来  wx.setStorageSync(key,value)


我试了,但是储存起来的值在返回的页面里不能遍历,因为生命周期已经走完了
返回时你要在上一个页面的onShow 方法里取值更新原有值


相关讨论:
navigator跳转的时候如何传递一个数组呢?

无论什么样的数组都行,只要能传递就好
如果只讨论跳转携带参数的问题。

页面跳转,前后端通讯,保存文件到磁盘都涉及到一个问题,就是数据序列化和反序列化。

简单举例就是:某个数据类型的变量--》可传输的数据格式--》某个数据类型的变量。

无论是小程序的navigator跳转,还是网站的url跳转,原理一样,携带的参数只能是字符、字符串。

其中常用的方法是JSON:比如
[AppleScript] 纯文本查看 复制代码
//跳转到订单页面
sublimitClick:function(e){

//订单列表 传参
var agrs = JSON.stringify(this.data.orderList);
wx.navigateTo({
url: '../order/order?list=' + agrs
})
},



然后在order页面的js中,
[AppleScript] 纯文本查看 复制代码
onLoad:function(options){
//options为页面跳转所带来的参数
//options取到key为list的字符串,JSON.parse 为object即可
var list = options.list;
list = JSON.prase(list);
},


当然还有一个方法是,保存在公共数据中:app.js中有globalData,A页面中在globalData设置值,B页面中在globalData取值。


可以用事件代替跳转然后data-arr设置数组对象



附录一:简单的input输入值的获取和传递(作者:风)
[AppleScript] 纯文本查看 复制代码
  <view class="bolder">
        账号:
        <input name="user" bindinput="inputUser" type="text"/>
        密码:
        <input name="password" bindinput="inputPwd" type="text" password="ture"/>
        <button bindtap="clickButton" >注册</button>
    </view>

input输入框显示自己输入的值,bindinput来对输入的值进行接受,再把值赋给一个变量。
使用官方给的API wx.setStorageSync(‘key’, ‘value’)将获取的值缓存到本地,在另一个页面用var value = wx.getStorageSync(‘key’)接受缓存的值。
[AppleScript] 纯文本查看 复制代码
Page({[/size][/color][/align][color=#000000]  data:{
    user:'',
    pwd:''
  },
  clickButton:function(){
    wx.setStorageSync('user', this.data.user);
    wx.setStorageSync('pwd', this.data.pwd);
    wx.navigateTo({
      url: '../success/success'
    })
  },
  inputUser:function(e){
    this.setData({
      user:e.detail.value
    })
  },
  inputPwd:function(e){
    this.setData({
      pwd:e.detail.value
    })
  }
})
在页面加载时完成取值和赋值。
[AppleScript] 纯文本查看 复制代码
Page({[/size][/color][/align][color=#000000]  data:{
    user:"",
    pwd:""
  },
  onLoad:function(options){
    // 页面初始化 options为页面跳转所带来的参数
    var user=wx.getStorageSync('user');
    var pwd=wx.getStorageSync('pwd');
    this.setData({user:user});
    this.setData({pwd:pwd});
  }
})

demo下载: dever-民工转职程序猿-demo.zip (149.77 KB, 下载次数: 16)
有问题请在本站内搜索相应关键词,假如无法解决请在综合交流区内发帖咨询,发帖时请提供详细的问题描述、相关图片及代码。
锁定一个精华帖,哈哈,果断收藏!
新增讨论:请问在别的页面进行操作之后怎么添加日志信息呢
例如我在index页面点击了一个按钮,我想在logs页面添加一条记录“点击了按钮”
答:追小命
页面和页面之间通信三个办法:

  • 通过setStorage写本地缓存。这样小程序退出也在
  • 页面中getApp(),将信息存到app的全局变量中
  • 如果两个页面都在currentPages里,通过getCurrentpages,或者把页面的this都跟全局注册,可以互相直接调用





新增讨论:
wx.navigateBack
用户按左上角返回按钮,会触发wx.navigateBack,能否传递参数
答:勇艺
        var pages = getCurrentPages();
        var prevPage = pages[pages.length - 2]    ,上一个页面对象
        //如果上一个页面是订单列表,回调刷新
        if (prevPage.__route__.indexOf("上一个网页名称") != -1) {

//xxxxxxx上一个页面方法名
          prevPage.XXXXXX(参数);    //已经操作了上一个页面的方法,你再返回就能看到效果了
        }




有问题请在本站内搜索相应关键词,假如无法解决请在综合交流区内发帖咨询,发帖时请提供详细的问题描述、相关图片及代码。
天下雪 发表于 2017-4-12 11:26
全网关于这块的东西,全在这了,同学看看是否能得到些这里面没有的一些新的启示 ...

不错,因为我是从bootstrap这种低级的前端入门的,所以前端不熟,这篇整好恶补一下,谢谢你昨天发布的关于3rdsession的帖子,稍后我再补一弹关于小程序session我的理解做回回馈
yeayee 发表于 2017-4-12 11:30
不错,因为我是从bootstrap这种低级的前端入门的,所以前端不熟,这篇整好恶补一下,谢谢你昨天发布的关 ...

你这种会员多来几个,我们网站就发家致富了;懂得学习并分享!
有问题请在本站内搜索相应关键词,假如无法解决请在综合交流区内发帖咨询,发帖时请提供详细的问题描述、相关图片及代码。
发新帖
您需要登录后才可以回帖 登录 | 立即注册