小程序使用vant实现下拉

原创已于 2022-02-25 11:31:17 修改 · 1.8k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#小程序

于 2021-06-08 11:41:09 首次发布

vant 专栏收录该内容

5 篇文章

订阅专栏

这是一个关于前端开发的示例，展示了如何使用van组件库创建一个包含'作业', '维修', '其他'三个选项的下拉选择框，用于输入出库原因。通过van-cell和van-dropdown-menu组件，实现了UI交互效果。

<van-cell title="出库原因" required>
      <van-dropdown-menu>
      	  <van-dropdown-item value="{{ useReason }}" options="{{ useReaOption }}" />
      </van-dropdown-menu>
</van-cell>

js文件

data: {
      useReaOption: [
        { text: '作业', value: 0 },
        { text: '维修', value: 1 },
        { text: '其他', value: 2 }
      ],
      useReason: 0,
  },

最终效果：