uniapp 下拉框实现

在uniapp中，可以使用`<picker>`标签来实现下拉框的效果。下面是一个简单的例子：

<template>
  <view>
    <picker :value="index" mode="selector" :range="array" @change="onChange">
      <view class="picker">
        当前选择：{{array[index]}}
      </view>
    </picker>
  </view>
</template>

<script>
export default {
  data() {
    return {
      index: 0,
      array: ['选项1', '选项2', '选项3', '选项4']
    }
  },
  methods: {
    onChange(event) {
      this.index = event.mp.detail.value
    }
  }
}
</script>

<style>
.picker {
  height: 50px;
  line-height: 50px;
  text-align: center;
  color: #007aff;
}
</style>

在上面的例子中，我们使用了`<picker>`标签来创建一个下拉框。`mode`属性设置为`selector`表示选择器模式，`range`属性设置为一个数组，表示下拉框中的选项。`@change`事件监听用户选择的变化，当用户选择一个新的选项时，会触发`onChange`方法，我们可以在这个方法中更新`index`的值，从而更新当前选择的选项。