小程序参数拼接/动态ID跳转对应页面/获取input值请求对应数据的参数

参数拼接

微信小程序传参路径拼接

这种的前后端交接是这种是formdata格式可以这种传

使用路由跳转url带值传值 https://blog.csdn.net/qq_43201350/article/details/108508791navigator标签传值 https://blog.csdn.net/qq_31383345/article/details/52795212
缓存设置传值 https://blog.csdn.net/Cituses/article/details/79565433全局App对象传值 https://blog.csdn.net/qq_39109182/article/details/96433444
小程序通过data-xxxx的方式进行传值 https://blog.csdn.net/m0_38134431/article/details/88788032

页面之间跳转并带参传递(url带参传递)

效果图

在这里插入图片描述
这个是使用路由跳转url带值传值案例
这个是+拼接 有兴趣的可以看下es6的拼接 ``

代码

这个是把数据写死
A页面
wxml

<view>
<view>我是a页面</view>
<text>你的名字{{name}}</text>
</view>
<view>
<text>你的年龄{{age}}</text>
</view>
<button bindtap='buttonListener'>数据跳转</button>
 

js

Page({
 
  /**
   * 页面的初始数据
   */
  data: {
   //这里把数据写死的操作
    name:'Tom',
    age:'12'
  },
 
  buttonListener:function(){
    let that = this
    wx.navigateTo({
      url: '/pages/2/2?nameData=' + that.data.name + '&ageData=' + that.data.age
      // 一般传多个参的话可以拼接 拼接用&来进行拼接   只传1个的话之间?拼接           大于1个用&拼接
      // ?跟的是你自定义的属性 这个页面定义这个属性 下个页面也要保持一致
    })
  }
})

B页面
wxml

<view>
<view>我是b页面</view>
<text>姓名为:{{name}}</text>
</view>
<view>
<text>年龄为:{{age}}</text>
</view>
  

js


Page({
 
  /**
   * 页面的初始数据
   */
  data: {
    name:null,
    age:null
  
  },
 
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    var that = this
    that.setData({
      name:options.nameData,
      age:options.ageData
    })
  
  }
})

动态ID跳转对应页面

不同页面获取动态ID跳

A页面

HTML
点击时获取对应的ID
在这里插入图片描述
js
这里的跳转是直接进行拼接就可以
比如获取ID 在跳转时直接拼接ID就行拉
在这里插入图片描述
拼接后面跟的是自定义的 自定义与接收时保持一致,+后面的是你要传入的值。

B页面

然后在b页面的onload里面进行接收传递过来的数据
上个页面声明的参数要与这里options后面相对应。(简而言之就是要和上个页面的跳转时拼接保持一致)

这里的delid是你自定义的参数,
在这里插入图片描述
然后在请求数据时 定义的参数直接这样写 ,
然后拼接
在这里插入图片描述
然后就实现了点击对应,显示点击对应的内容 。
与上面的差不多 只不过上面的数据是写死的 ,这里是动态的。

获取input值请求对应数据的参数

以前我都是存取 虽然可以实现,但是严格来说是不对的,
最好使用这个方法

小程序获取input的值并发送请求

这里指当在一个页面时
wxml
获取input的值得变化

 <input type="text" bindinput="btnorganization" placeholder="请输入检测机构" value="{{organization}}" />

js

data{
organization: ''//定义一个值用来绑定输入值得我状态
}

 btnorganization(e) {
    this.setData({
      organization: e.detail.value
    })
  },//通过点击事件绑定输入的状态

然后在请求接口传参时拿
 var organ=this.data.organization//直接这样拿 
var的是你自定义的属性
后面请求接口参数拼接时与你自定义的保持一致

在这里插入图片描述

通过ID跳转不同页面

参考1

参考2
参考3
参考4 这个有源码参考

  • 1
    点赞
  • 14
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值