<span id="mktg5"></span>

<i id="mktg5"><meter id="mktg5"></meter></i>

        <label id="mktg5"><meter id="mktg5"></meter></label>
        最新文章專題視頻專題問答1問答10問答100問答1000問答2000關鍵字專題1關鍵字專題50關鍵字專題500關鍵字專題1500TAG最新視頻文章推薦1 推薦3 推薦5 推薦7 推薦9 推薦11 推薦13 推薦15 推薦17 推薦19 推薦21 推薦23 推薦25 推薦27 推薦29 推薦31 推薦33 推薦35 推薦37視頻文章20視頻文章30視頻文章40視頻文章50視頻文章60 視頻文章70視頻文章80視頻文章90視頻文章100視頻文章120視頻文章140 視頻2關鍵字專題關鍵字專題tag2tag3文章專題文章專題2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章專題3
        問答文章1 問答文章501 問答文章1001 問答文章1501 問答文章2001 問答文章2501 問答文章3001 問答文章3501 問答文章4001 問答文章4501 問答文章5001 問答文章5501 問答文章6001 問答文章6501 問答文章7001 問答文章7501 問答文章8001 問答文章8501 問答文章9001 問答文章9501
        當前位置: 首頁 - 科技 - 知識百科 - 正文

        微信小程序開發之改變data中數組或對象的某一屬性值

        來源:懂視網 責編:小采 時間:2020-11-27 22:12:05
        文檔

        微信小程序開發之改變data中數組或對象的某一屬性值

        微信小程序開發之改變data中數組或對象的某一屬性值:前言:在小程序的開發中,我們在view中便利data中數組或對象時,很多情況下需要在js中動態改變數組或者對象中某一香的屬性值。 效果圖: 我給大家總結了案例如下: wxml如下: <scroll-view class='hd-cont' scroll-x=true
        推薦度:
        導讀微信小程序開發之改變data中數組或對象的某一屬性值:前言:在小程序的開發中,我們在view中便利data中數組或對象時,很多情況下需要在js中動態改變數組或者對象中某一香的屬性值。 效果圖: 我給大家總結了案例如下: wxml如下: <scroll-view class='hd-cont' scroll-x=true

        前言:在小程序的開發中,我們在view中便利data中數組或對象時,很多情況下需要在js中動態改變數組或者對象中某一香的屬性值。

        效果圖:

        我給大家總結了案例如下:

        wxml如下:

        <scroll-view class='hd-cont' scroll-x="true" style='width: 100%'>
         <view wx:for="{{sDate}}" wx:key="{{index}}" class='date-cont'>
         <view>{{item.week}}</view>
         <view bindtap='select' data-index="{{index}}" class=' curl {{item.selected}}'>{{item.date}}</view>
         </view>
        </scroll-view> 

        wxss如下:

        .hd-cont {
         height: 126rpx;
         white-space: nowrap;
         padding-left: 20rpx;
         color: #fff;
         font-size: 28rpx;
         box-sizing: border-box;
        }
        .date-cont {
         width: 40rpx;
         margin-right: 70rpx;
         height: 100%;
         display: inline-block;
         padding-top: 10rpx;
         box-sizing: border-box;
         text-align: center;
        }
        .curl {
         width: 40rpx;
         height: 40rpx;
         border-radius: 50%;
         line-height: 40rpx;
        }
        .date-cont view:first-child {
         margin-bottom: 20rpx;
        }
        .focus {
         display: inline-block;
         width: 40rpx;
         height: 40rpx;
         font-family: Monaco;">#fff;
         color: #16cc80;
         border-radius: 50%;
         line-height: 40rpx;
        }

        wxjs如下:

        實現思路:點擊某一個日期時,獲取當前點擊的下表,點擊事件bindtap可以獲取到所點擊的元素的自定義屬性,也就是所點擊的元素的在data中數組的下標,點擊觸發,清空所有對象中selected的值,然后將所點擊的下標的selected值變為focus就可實現點擊某一元素動態改變數組中的某一屬性值。

        Page({
        data: {
         sDate: [
         { "week": "日", "date": "01" ,"selected": "focus" },
         { "week": "一", "date": "02", "selected": " " },
         { "week": "二", "date": "03", "selected": " " },
         { "week": "三", "date": "04", "selected": " " },
         { "week": "四", "date": "05", "selected": " " },
         { "week": "五", "date": "06", "selected": " " },
         { "week": "六", "date": "07", "selected": " " },
         { "week": "日", "date": "08", "selected": " " },
         { "week": "一", "date": "09", "selected": " " },
         { "week": "二", "date": "10", "selected": " " },
         { "week": "三", "date": "11", "selected": " " },
         { "week": "四", "date": "12", "selected": " " },
         { "week": "五", "date": "13", "selected": " " },
         { "week": "六", "date": "14", "selected": " " },
         ]
        },
        select: function (e) {
         var oIndex = e.currentTarget.dataset.index;
         var array = this.data.sDate;
         array.forEach( (item,index,arr) => {
         var sItem = "sDate["+ index + "].selected";
         this.setData({
         [sItem]: " "
         })
         console.log([sItem]);
         if(index == oIndex) {
         var oSelected = "sDate[" + index + "].selected"http://這里需要將設置的屬性用字符串進行拼接
         this.setData({
         [oSelected]: "focus"
         })
         }
         })
        },
        })

         總結

        以上所述是小編給大家介紹的微信小程序開發之改變data中數組或對象的某一屬性值,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網站的支持!

        聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

        文檔

        微信小程序開發之改變data中數組或對象的某一屬性值

        微信小程序開發之改變data中數組或對象的某一屬性值:前言:在小程序的開發中,我們在view中便利data中數組或對象時,很多情況下需要在js中動態改變數組或者對象中某一香的屬性值。 效果圖: 我給大家總結了案例如下: wxml如下: <scroll-view class='hd-cont' scroll-x=true
        推薦度:
        • 熱門焦點

        最新推薦

        猜你喜歡

        熱門推薦

        專題
        Top
        主站蜘蛛池模板: 国产成人免费片在线视频观看| 成人午夜18免费看| 亚洲欧洲日产韩国在线| 亚洲一区精品视频在线| 深夜免费在线视频| 亚洲中文无韩国r级电影| 一级成人a免费视频| 免费人成视频在线观看网站| 四虎永久免费地址在线网站 | 黄床大片30分钟免费看| 久久国产精品国产自线拍免费| 相泽南亚洲一区二区在线播放| 丁香六月婷婷精品免费观看| 亚洲国产黄在线观看| 九九热久久免费视频| 7723日本高清完整版免费| 亚洲国产综合精品| 大陆一级毛片免费视频观看| 亚洲成熟丰满熟妇高潮XXXXX| 外国成人网在线观看免费视频| 免费视频精品一区二区三区| 亚洲精品天天影视综合网| 亚洲一区二区三区免费在线观看 | 春暖花开亚洲性无区一区二区| 久久亚洲免费视频| 亚洲熟妇av一区二区三区下载| 精品一区二区三区高清免费观看| 最近中文字幕mv手机免费高清| 亚洲AV无码一区二区乱子伦 | 亚洲国产精品自在自线观看| 伊人久久亚洲综合影院 | 亚洲精品无码专区在线在线播放| 亚洲精品无码av片| 亚洲欧洲中文日韩av乱码| 日本视频在线观看永久免费| 99热亚洲色精品国产88| 亚洲AV成人精品日韩一区18p| 亚洲精品GV天堂无码男同| 国产成人综合亚洲AV第一页| 妻子5免费完整高清电视| 黄色免费网址在线观看|