本篇文章为大家展示了微信小程序select下拉框实现，内容简明扼要并且容易理解，绝对能使你眼前一亮，通过这篇文章的详细介绍希望你能有所收获。
成都创新互联长期为上千余家客户提供的网站建设服务，团队从业经验10年，关注不同地域、不同群体，并针对不同对象提供差异化的产品和服务；打造开放共赢平台，与合作伙伴共同营造健康的互联网生态环境。为新余企业提供专业的成都网站制作、做网站、外贸营销网站建设，新余网站改版等技术服务。拥有十载丰富建站经验和众多成功案例,为您定制开发。
商品金额
￥99.00
{{tihuoWay}}
运费
免邮
实际付款
￥99.00
重庆分店
东莞南城分店
东莞总店
下面是js代码
Page({
/**
* 页面的初始数据
*/
data: {
select: false,
tihuoWay: '门店自提'
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
bindShowMsg() {
this.setData({
select:!this.data.select
})
},
mySelect(e) {
var name = e.currentTarget.dataset.name
this.setData({
tihuoWay: name,
select: false
})
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
}).list-msg {
padding: 0 20rpx;
background-color: #fff;
position: relative;
}
.list-msg1 {
height: 60rpx;
display: flex;
align-items: center;
justify-content: space-between;
}
.list-msg .list-msg2 {
height: 60rpx;
display: flex;
align-items: center;
justify-content: space-between;
border: 1px solid #ccc;
padding: 0 10rpx;
}
.select_box {
background-color: #eee;
padding: 0 10rpx;
width: 93%;
position: absolute;
top: 130rpx;
z-index: 1;
overflow: hidden;
animation: myfirst 0.5s;
}
@keyframes myfirst {
from {
height: 0rpx;
}
to {
height: 210rpx;
}
}
.select_one {
height: 60rpx;
line-height: 60rpx;
border-bottom: 1px solid #ccc;
}上述内容就是微信小程序select下拉框实现，你们学到知识或技能了吗？如果还想学到更多技能或者丰富自己的知识储备，欢迎关注创新互联行业资讯频道。
分享题目：微信小程序select下拉框实现
路径分享：
http://bjjierui.cn/article/jgsdes.html
