js怎么把一個數組里面的值作為一個屬性添加到另一數組包含的對象里(小程序)


上面這個需求我說的似乎不太明白,之前也是沒有碰到過,也是最近在搞小程序,涉及到小程序前后台數據交互,展示的部分!!不太明白沒關系等會我給大家舉個例子,就明白了說起來有點拗口,一看就明白了,其實如果是原生js開發,並不要這么做,就因為小程序它把一些東西綁到了視圖層上了,例如:for循環,當你拿到的數據格式不對時,所以就會在展示數據的時候你就需要做一點點處理,當然了如果你們后台能給到你正好需要的格式那你就輕松,萬一不是你需要的正好的格式那就需要你自己去做些處理!!

例子:

例如下面這個界面:

其實在wxml視圖層就一個for循環就搞定了!

wxml:

<view class="page-header">
  <text class="page-header-text">{{title}}</text>
</view>
<scroll-view scroll-y="true">
  <navigator class="navigator" url="../audio/audio?id={{item.muId}}" wx:for="{{imagescoverArr}}">
    <view class="Name">
      <view style="color:red; display:inline-block;">{{item.faName}}</view>
      <view style="color: #F4F4F4; display:inline-block; margin-left:6rpx;">{{item.nickname}}</view>
    </view>
    <view>
      <image class="image" src="{{item.imcsrc}}"></image>
    </view>
    <view class="muName">{{item.muName}}</view>

  </navigator>

</scroll-view>

那么現在問題出現了:我從后台拿到的圖片的路徑是這樣 "img/100230002/2017/3/13/9/201703130115070484063.jpg” ,看圖:

  

問題出在那?(當時並沒有imcsrc字段)

就是里面那個muCover沒有辦法直接用,而wxml里面for里面所展示的內容必須是for循環這一個數組里面的東西,不能摻雜別數組里面的東西;所以就要對這個字段處理一下!

如上圖當時並沒有imcsrc字段,imcsrc是我對muCover字段處理過后然后又給這個對象添加了imcsrc屬性;處理方法如下:

//success是請求成功后的cb函數:

success: function(res) {
  for(var i=0; i<res.data.content.length; i++){

  arr.push("http://files.mchang.cn/"+res.data.content[i].muCover.replace(/.jpg/, '/100x100.jpg'))
  res.data.content[i].imcsrc=arr[i];
  }
  console.log(res.data.content)
  that.setData({
  imagescoverArr: res.data.content
  })
}

其實思路:先把數組對象里面這個屬性給單獨拿出來做一下字符串處理,處理成你想要的能直接用的格式,完了再把處理過后的東西作為一個屬性返給這個對象,這樣就可以直接用點語法直接用了!

 

附加提示:小程序設計圖給的尺寸和rpx的轉換:(rpx其實意思就是手機上的物理像素)蘋果6手機屏幕寬是375px,750物理像素,顧750的量出來多少就是多少rpx;

      如果是750的量出來多少px就是多少rpx

      如果是640的,量出來的值需要乘以750/640得到rpx

看下圖

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM