uniapp用对象的形式实现picker

goiᐝ

于 2022-04-02 16:21:28 发布

阅读量552

点赞数

分类专栏： uniapp 文章标签：前端

本文链接：https://blog.youkuaiyun.com/weixin_59638880/article/details/123923164

版权

本文介绍如何在uniapp中通过对象的方式设置并使用Picker组件，详细解析数据接口及JavaScript实现过程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

代码

<picker @change="change($event, options)" :value="index" :range="options" range-key="name" class="ak-fill-picker" v-if="number == 1">
									<view class="uni-input">{{options[index].name}}</view>
								</picker>

data

options: [],

接口

this.$request('filter/workshop', {
					num: 3
				}, 'GET', {
					'Authorization': this.token
				}).then(res => {
					console.log(res.data)
					this.options = res.data
					this.result.result = this.options[1].name 
					// this.defaultRegion1.push(this.options[1].id)
					this.groupId = this.options[1].id
				})

change(e,options){
				console.log(e,options)
					this.index = e.detail.value
					this.groupId = options[this.index].id
					console.log(this.groupId)
				// 	console.log(item.list[this.value])
					 
				// 	item.name = item.list[this.value]
				// 	console.log(item.name)
			},