小程序?qū)崿F(xiàn)上下移動(dòng)切換位置
本文實(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 }) }
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
javascript代碼實(shí)現(xiàn)簡(jiǎn)易計(jì)算器
這篇文章主要為大家詳細(xì)介紹了javascript代碼實(shí)現(xiàn)簡(jiǎn)易計(jì)算器,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-01-01JavaScript Canvas繪制圓形時(shí)鐘效果
這篇文章主要為大家詳細(xì)介紹了JavaScript Canvas繪制圓形時(shí)鐘效果的相關(guān)資料,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-04-04一個(gè)仿微博登陸郵箱提示框js開(kāi)發(fā)案例
這篇文章主要為大家詳細(xì)介紹了一個(gè)仿郵箱登錄提示框js開(kāi)發(fā)案例,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-07-07JS實(shí)現(xiàn)自適應(yīng)高度表單文本框的方法
這篇文章主要介紹了JS實(shí)現(xiàn)自適應(yīng)高度表單文本框的方法,實(shí)例分析了針對(duì)IE內(nèi)核與非IE內(nèi)核下的javascript控制文本框樣式的技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下2015-02-02基于JS實(shí)現(xiàn)帶并發(fā)限制的異步調(diào)度器
這篇文章主要為大家詳細(xì)介紹了如何基于JS實(shí)現(xiàn)帶并發(fā)限制的異步調(diào)度器,文中的示例代碼講解詳細(xì),具有一定的學(xué)習(xí)價(jià)值,需要的可以參考下2023-05-05JavaScript中通用的jquery動(dòng)畫滾屏實(shí)例
這篇文章主要介紹了JavaScript中通用的jquery動(dòng)畫滾屏實(shí)例,本文通過(guò)實(shí)際代碼來(lái)詳解實(shí)現(xiàn)方法,需要的朋友可以參考一下2022-07-07JavaScript 拖拽實(shí)現(xiàn)(附注釋),最經(jīng)典簡(jiǎn)單短小精悍!
JavaScript拖拽實(shí)現(xiàn)(附注釋),最經(jīng)典!最簡(jiǎn)單!短小精悍!2009-04-04JavaScript中運(yùn)算符與數(shù)組擴(kuò)展詳細(xì)講解
這篇文章主要介紹了JavaScript中運(yùn)算符與數(shù)組擴(kuò)展方法,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)吧2022-11-11不同js異步函數(shù)同步的實(shí)現(xiàn)方法
下面小編就為大家?guī)?lái)一篇不同js異步函數(shù)同步的實(shí)現(xiàn)方法。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-05-05JavaScript中的console.group()函數(shù)詳細(xì)介紹
這篇文章主要介紹了JavaScript中的console.group()函數(shù)詳細(xì)介紹,當(dāng)程序調(diào)試日志過(guò)多時(shí)會(huì)有些雜亂,此時(shí)可以使用console.group()函數(shù)調(diào)來(lái)分組顯示,需要的朋友可以參考下2014-12-12