本文实例为大家分享了小程序实现上下切换位置的具体代码,供大家参考,具体内容如下
小程序上下切换位置
wxml
{{item.name}} 上 下
js:
// pages/yidong/yidong.js
Page({
data: {
companydata:[
{
id:0,
name:'产品1'
},
{
id:1,
name:'产品2'
},
{
id:2,
name:'产品3'
},
{
id:3,
name:'产品4'
},
{
id:4,
name:'产品5'
}
]
},
//位置向上移动
topClick: function(e) {
var that = this
var index = e.currentTarget.dataset.index
var one = that.data.companyData[index]
var two = that.data.companyData[index - 1]
var index2 = index - 1
var data1 = "companyData[" + index + "]"
var data2 = "companyData[" + index2 + "]"
that.setData({
[data1]: two,
[data2]: one
})
},
// 位置向下移动
bottomClick: function(e) {
var that = this
var index = e.currentTarget.dataset.index
var one = that.data.companyData[index]
var two = that.data.companyData[index + 1]
var index2 = index + 1
var data1 = "companyData[" + index + "]"
var data2 = "companyData[" + index2 + "]"
that.setData({
[data1]: two,
[data2]: one
})
},
onLoad: function (options) {
},
onReady: function () {
},
onShow: function () {
},
onHide: function () {
},
onUnload: function () {
},
onPullDownRefresh: function () {
},
onReachBottom: function () {
},
onShareAppMessage: function () {
}
})
以上仅供参考,方便大家学习!!
为大家推荐现在关注度比较高的微信小程序教程一篇:《微信小程序开发教程》小编为大家精心整理的,希望喜欢。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持考高分网。



