本文例項為大家分享了小程式實現商品屬性選擇或規格選擇的具體程式碼，供大家參考，具體內容如下

實現效果

1.wxml

<view wx:for="{{list}}" wx:key="index" wx:key="index" wx:for-index="childIndex" style="margin: 40px 0">
  <view>{{item.name}}</view>
 
 
  <view class="s" wx:for="{{item.option_value}}" wx:key="index" >
   <text class="{{indexArr[childIndex] == index ? 'active':''}}" bindtap="choice" data-fid="{{childIndex}}" data-id="{{index}}">
    {{itRNNgyt
 
em.name}}
   </text>
  </view>
&l程式設計客棧t;/view>

2.js

data: {
 //資料
  list: [
   {
    "goods_option_id": 1737,"option_id": 1737,"name": "冰度","option_value": [
     {
      "goods_option_value_id": 3606,"option_value_id": 3606,"name": "正常冰","image": "xxxxxx.png"
     },{
      "goods_option_value_id": 3605,"option_value_id": 3605,"name": "少冰",{
      "goods_option_value_id": 3604,"option_value_id": 3604,"name": "熱飲","image": "xxxxxx.png"
     }
    ]
   },RNNgyt
 
  {
    "goods_option_id": 1738,"option_id": 1738,"name": "糖度","option_value": [
     {
      "goods_option_value_id": 3608,"option_value_id": 3608,"name": "正常糖",{
      "goods_option_value_id": 3607,"option_value_id": 3607,"name": "少糖",{
    "goods_option_id": 1737,"image": RNNgyt"xxxxxx.png"
     },"image": "xxxxxx.png"
     }
    ]
   }
  ],arr: [],indexArr: []
 },choice(e) {
  const fid = e.currentTarget.dataset.fid;
   const id = e.currentTarget.dataset.id;
  const arr = this.data.arr,arr2 = this.data.indexArrRNNgyt
 
;
    
   arr[fid] = this.data.list[fid].option_value[id].name;
  arr2[fid] = id;

  this.setData({
   arr: arr,indexArr: arr2
  })
 },onLoad: function (options) {
  const res = this.data.indexArr;
  this.data.list.forEach((e,i) => {
   res[i] = 0;
   this.setData({
    indexArr: res
   })
  });
 }

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支援我們。