小程序?qū)崿F(xiàn)上下移動(dòng)切換位置
更新時(shí)間:2019年09月23日 11:28:58 作者:Bright2017
這篇文章主要為大家詳細(xì)介紹了小程序?qū)崿F(xiàn)上下移動(dòng)切換位置,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下
本文實(shí)例為大家分享了小程序?qū)崿F(xiàn)上下移動(dòng)切換位置的具體代碼,供大家參考,具體內(nèi)容如下

<view wx:for="{{companyData}}" wx:key="{{item.id}}" class="overHiden">
<view class="floarLeft">{{item.name}}</view>
<view class="floarRight" wx:if="{{index != 0}}" data-index="{{index}}" bindtap="topClick">
<image src="../../images/32.png" class="rightmenuImg"></image>
</view>
<view class="floarRight" wx:if="{{index != companyData.length-1}}" data-index="{{index}}" bindtap="bottomClick">
<image src="../../images/33.png" class="rightmenuImg"></image>
</view>
</view>
data{
companyData:[
{
id:0,
name:'產(chǎn)品1'
},
{
id:1,
name:'產(chǎn)品2'
},
{
id:2,
name:'產(chǎn)品3'
},
{
id:3,
name:'產(chǎn)品4'
},
{
id:4,
name:'產(chǎn)品5'
}
]
}
//位置向上移動(dòng)
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
})
},
// 位置向下移動(dòng)
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
})
}
以上就是本文的全部內(nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
BootStrap表單驗(yàn)證 FormValidation 調(diào)整反饋圖標(biāo)位置的實(shí)例代碼
這篇文章主要介紹了BootStrap表單驗(yàn)證 FormValidation 調(diào)整反饋圖標(biāo)位置的實(shí)例代碼,需要的朋友可以參考下2017-05-05
詳解 javascript對(duì)象創(chuàng)建模式
這篇文章主要介紹了詳解 javascript對(duì)象創(chuàng)建模式的相關(guān)資料,幫助大家更好的理解和學(xué)習(xí)JavaScript的相關(guān)知識(shí)。感興趣的朋友可以了解下2020-10-10
JavaScript變量中var,let和const的區(qū)別
這篇文章主要介紹了JavaScript變量中var,let和const的區(qū)別,JavaScript中一共有3種用來聲明變量的關(guān)鍵字,分別是var、let和const,文章通過圍繞主題展開對(duì)三個(gè)關(guān)鍵詞的詳細(xì)介紹,需要的朋友可以參考一下2022-09-09
uni-app小程序分享功能實(shí)現(xiàn)方法舉例
這篇文章主要給大家介紹了關(guān)于uni-app小程序分享功能實(shí)現(xiàn)方法的相關(guān)資料,uni-app中有分享的API接口,但是需要現(xiàn)在QQ或者微信等開發(fā)者平臺(tái)上注冊(cè)賬號(hào),驗(yàn)證公司信息,而且只能分享圖片或者文本等內(nèi)容,需要的朋友可以參考下2023-07-07

