微信小程序之页面传值
1.生命周期函数--监听页面加载(options接收值)
1.1 navigator
1. <!--pages/auction/auction.wxml-->
<view class="container">
<view class="auction-item" wx:for="{{auctionList}}" wx:for-item="row" wx:key="index">
<navigator url="/pages/auctionDetail/auctionDetail?auctionId={{row.id}}">
2. // pages/auctionDetail/auctionDetail.js
onLoad: function(options) {
this.setData({
auctionId: options.auctionId
});
1.2 navigateTo
1. // pages/auctionDetail/auctionDetail.js
wx.navigateTo({
url: '/pages/deposit/deposit?itemId=' + itemId
})
2. // pages/deposit/deposit.js
onLoad: function(options) {
this.setData({
itemId: options.itemId
});
2. 绑定点击事件传值
1. <!--pages/auctionDetail/auctionDetail.wxml-->
<block wx:if="{{auctionDetail.deposit.total}}">
<view class="bottom" bindtap="toBid" data-itemid="{{item.id}}">
<label>竞 拍</label>
</view>
</block>
2. // pages/auctionDetail/auctionDetail.js
toBid: function(e) {
var itemId = e.currentTarget.dataset.itemid;
if (auth.authentication) {
wx.navigateTo({
url: '/pages/bid/bid?itemId=' + itemId
})
}
}
3. 双向绑定实时改变值
1. <!--pages/login/login.wxml-->
<view class="form">
<view class="row-group">
<text>手机</text>
<input placeholder="请填写手机号码" placeholder-class='txt' maxlength='11' bindinput="bindPhoneInput" value="{{phone}}" />
</view>
<view class="row-group">
<text>验证码</text>
<input placeholder="请填写验证码" placeholder-class='txt' maxlength='4' bindinput="bindCodeInput" value="{{code}}" />
<view class="code" bindtap="onClickCheckCode">获取验证码</view>
</view>
<view>
<button class="submit" open-type="getUserInfo" bindgetuserinfo="onClickSubmit">登录 | 注册</button>
</view>
</view>
2. // pages/login/login.js
data: {
phone: "15131255089",
code: ""
},
bindPhoneInput: function(e) {
this.setData({
phone: e.detail.value
});
},
bindCodeInput: function(e) {
this.setData({
code: e.detail.value
});
}
希望你眼眸有星辰,心中有山海,从此以梦为马,不负韶华