javascript - Bagaimanakah pemilih program kecil mendapat nilai objArray?

Question

Komponen pemilih program kecil, anda dapat melihat bahawa terdapat jenis objArray dalam demo, tetapi ia tidak digunakan Sekarang saya mempunyai set objArray yang perlu saya gunakan, tetapi ia tidak boleh dipaparkan seperti biasa :

Pautan demo program mini: pemetik

wxml:

<picker bindchange="bindPickerChange" value="{{index}}" range="{{objectArray}}">
    <view class="picker">
      当前选择：{{objectArray[index]}}
    </view>
</picker>

js:

Page({
  data: {
    objectArray: [
      {
        id: 0,
        name: '美国'
      },
      {
        id: 1,
        name: '中国'
      },
      {
        id: 2,
        name: '巴西'
      },
      {
        id: 3,
        name: '日本'
      }
    ]
  },
  bindPickerChange: function(e) {
    console.log('picker发送选择改变，携带值为', e.detail.value)
    this.setData({
      index: e.detail.value
    })
  }
})

Dalam kes ini, pilihan drop-down yang dipaparkan ialah [objek Objek], dan perkara yang sama dipaparkan pada halaman selepas pemilihan Sekarang saya mahu senarai juntai bawah memaparkan nilai dalam nama, dan kemudian mengetahui id yang dipilih. Saya benar-benar tidak tahu bagaimana untuk melaksanakannya. . .

Answer 1

Sepatutnya boleh menggunakan atribut ini Kod yang diubah suai adalah seperti berikut:

<picker bindchange="bindPickerChange" value="{{index}}" range-key="name" range="{{objectArray}}">
    <view class="picker">
      当前选择：{{objectArray[index].name}}
    </view>
</picker>

Kemas kini1:

Page({
  data: {
    objectArray: [
      {
        id: 0,
        name: '美国'
      },
      {
        id: 1,
        name: '中国'
      },
      {
        id: 2,
        name: '巴西'
      },
      {
        id: 3,
        name: '日本'
      }
    ]
  },
  bindPickerChange: function(e) {
    console.log('picker发送选择改变，携带值为', e.detail.value)
    var index = e.detail.value;
    var currentId = this.data.objectArray[index].id; // 这个id就是选中项的id
    this.setData({
      index: e.detail.value
    })
  }
})

Answer 2

Tambah range-key='obj.item', sebagai contoh

<picker bindchange="bindPickerChange" value="{{index}}" range-key="name" range="{{objectArray}}">
    <view class="picker">
      当前选择：{{objectArray[index].name}}
    </view>
</picker