⼩程序传值的⼏种⽅式
1、标签传值
input标签placeholder属性⾸先通过在标签给标签添加 data-属性名 属性并赋值，然后绑定 tap 事件获取事件 event 中的
<view data-index="10" bindtap="myTap">点击获取值</view>
然后获取事件 event 中的 就可获取到刚刚绑定的值
Page({
myTap (e) {
let index = e.target.dataset.index
console.log(index) // 10
}
})
主要事项：
1. 注意如果给 data-属性名 绑定的属性名是驼峰命名法的⽅式，如 myName。那么获取到的属性名会⾃动装换为全⼩写，
如： e.ame。
2. 如果给想要获取的属性名是驼峰命名法，那么要使⽤ - 相连的⽅式赋值：
<view data-my-name="⼩明" bindtap="myTap">点击获取值</view>
这样取出来的值就会是驼峰命名法了
Page({
myTap (e) {
let name = e.Nmae
console.log(name) // ⼩明
}
})
2、页⾯传值
页⾯传值主要是路由之间的传值，在⼩程序中路由之间传值有两种⽅式。
2.1 navigator 标签传值
<navigator url="/page/index/index?id=1"></navigator>
关于 navigator 的详细使⽤⽅式请参考：
2.2 调⽤ API wx.navigateTo(Object)
<view bindtap="skip(1)">点击跳转并传值</view>
skip (id) {
wx.navigator({
url: "/page/index/index?id=" + parsetInt(id)
})
}
2.3 在跳转⽬标页⾯获取参数⽅式
在⽬标页⾯ onLoad ⽣命周期函数中获取
Page({
onLoad (options) {
console.log(options.query.id) // 获取路由 get 参数
}
})
3、from 传值
通过表单 <form bindsumit="formSubmit"> 与 <button formType="submit"></button> 配合使⽤
<form bindsubmit="formSubmit">
<input name="detail" placeholder="详情地址" />
<input name="realname" placeholder="收件⼈姓名" />
<input name="mobile" placeholder="⼿机号码" type="number"/>
<button formType="submit" type="primary">Submit</button>
</form>
formSubmit: (e) => {
let data = e.detail.value //表单数据
let { datail, realname, mobile } = data
}

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。