uniapp Uview2.x版本 picker怎么实现五级选择器

在uView2.x版本中，Picker组件的使用方式与1.x版本略有不同。下面是一个五级选择器的示例代码：

<template>
  <view class="picker">
    <picker :columns="columns" @change="onChange"></picker>
  </view>
</template>

<script>
export default {
  data() {
    return {
      columns: [
        {
          values: ['省份1', '省份2', '省份3'],
          defaultIndex: 0,
          onChange: (value, index) => {
            // 省份变化时更新城市列表
            const cityValues = this.getCityList(index)
            this.$set(this.columns, 1, {
              values: cityValues,
              defaultIndex: 0
            })
            // 重置下级选项
            this.$set(this.columns, 2, { values: [], defaultIndex: 0 })
            this.$set(this.columns, 3, { values: [], defaultIndex: 0 })
            this.$set(this.columns, 4, { values: [], defaultIndex: 0 })
          }
        },
        {
          values: [],
          defaultIndex: 0,
          onChange: (value, index) => {
            // 城市变化时更新区县列表
            const districtValues = this.getDistrictList(index)
            this.$set(this.columns, 2, {
              values: districtValues,
              defaultIndex: 0
            })
            // 重置下级选项
            this.$set(this.columns, 3, { values: [], defaultIndex: 0 })
            this.$set(this.columns, 4, { values: [], defaultIndex: 0 })
          }
        },
        {
          values: [],
          defaultIndex: 0,
          onChange: (value, index) => {
            // 区县变化时更新街道列表
            const streetValues = this.getStreetList(index)
            this.$set(this.columns, 3, {
              values: streetValues,
              defaultIndex: 0
            })
            // 重置下级选项
            this.$set(this.columns, 4, { values: [], defaultIndex: 0 })
          }
        },
        {
          values: [],
          defaultIndex: 0,
          onChange: (value, index) => {
            // 街道变化时更新村庄列表
            const villageValues = this.getVillageList(index)
            this.$set(this.columns, 4, {
              values: villageValues,
              defaultIndex: 0
            })
          }
        },
        {
          values: [],
          defaultIndex: 0
        }
      ]
    }
  },
  methods: {
    onChange(e) {
      // 用户选择最后一个选项时输出最终结果
      if (e.detail.column === 4) {
        const province = this.columns[0].values[e.detail.value[0]]
        const city = this.columns[1].values[e.detail.value[1]]
        const district = this.columns[2].values[e.detail.value[2]]
        const street = this.columns[3].values[e.detail.value[3]]
        const village = this.columns[4].values[e.detail.value[4]]
        console.log(`${province}-${city}-${district}-${street}-${village}`)
      }
    },
    getCityList(provinceIndex) {
      // 根据省份获取城市列表
      // TODO: 根据实际需求替换为异步请求或本地数据
      return ['城市1', '城市2', '城市3']
    },
    getDistrictList(cityIndex) {
      // 根据城市获取区县列表
      // TODO: 根据实际需求替换为异步请求或本地数据
      return ['区县1', '区县2', '区县3']
    },
    getStreetList(districtIndex) {
      // 根据区县获取街道列表
      // TODO: 根据实际需求替换为异步请求或本地数据
      return ['街道1', '街道2', '街道3']
    },
    getVillageList(streetIndex) {
      // 根据街道获取村庄列表
      // TODO: 根据实际需求替换为异步请求或本地数据
      return ['村庄1', '村庄2', '村庄3']
    }
  },
  mounted() {
    // 初始化省份列表
    const provinceValues = this.columns[0].values
    this.columns[1].values = this.getCityList(0)
    // 初始化城市列表
    const cityValues = this.columns[1].values
    this.columns[2].values = this.getDistrictList(0)
    // 初始化区县列表
    const districtValues = this.columns[2].values
    this.columns[3].values = this.getStreetList(0)
    // 初始化街道列表
    const streetValues = this.columns[3].values
    this.columns[4].values = this.getVillageList(0)
  }
}
</script>

<style>
.picker {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
</style>

在上面的代码中，我们使用了一个Picker组件，并在其内部嵌套了多个列，对应省份、城市、区县、街道、村庄五个级别。每当用户选择某个级别的选项时，我们会根据该级别的值更新下一个级别的选项列表。当用户选择最后一个级别时，我们会输出最终的选择结果。

注意，由于uView2.x版本的Picker组件使用的是小程序原生的picker-view组件，因此在更新列的值时需要使用`$set`方法。另外，由于Picker组件的默认值是根据各列的`defaultIndex`属性来确定的，因此在更新列的值时也需要更新默认值。