参数拼接
微信小程序传参路径拼接
这种的前后端交接是这种是formdata格式可以这种传
页面之间跳转并带参传递(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的是你自定义的属性
后面请求接口参数拼接时与你自定义的保持一致