uni-app picker二级分类获取数据展示

最终效果

下拉选择框

选择后显示

picker处代码

<picker class="item-picker" mode="multiSelector" range-key="name" @change="classifyChange" @columnchange="columnchange" :value="classifyIndex" :range="classifyArr">
	<view class="input_box line">
		<view class="name required">拍品分类</view>
		<view class="select_info">
			<view class="value" v-if="classify2Obj.name || classify1Obj.name">{{classify2Obj.name || classify1Obj.name}}</view>
			<view class="select" v-else>请选择拍品分类</view>
		</view>
	</view>
</picker>

data() {
		return {
		    //获取到的分类信息
			classifyArr:[[],[]],
			//选择的index
			classifyIndex: 99999,
			//选择的一级分类
			classify1Obj: {},
			//选择的二级分类
			classify2Obj: {},
		};
	},

onLoad获取数据

//获取一级分类 以及一级分类第一个的子分类
this.getCategory(0,0);

//这个接口既能获取一级分类也能获取子分类，因此放在一次
async getCategory(pid, column){
			try {
				let res = await this.$http.get('api/auction/goods/v1/category', {
				    //pid为0时，获取一级分类
					pid: pid
				});
				//存在一级分类是获取子分类
				if(res.length > 0){
					// #ifdef H5
					this.classifyArr[column] = res;
					//不加强制更新h5的值没法变化
					this.$forceUpdate();
					// #endif
					// #ifndef H5
					this.$set(this.classifyArr, column, res);
					// #endif
					//设置的是存在id即为内容回显
					if(pid == 0 && !this.id){
						await this.getCategory(res[0].objId, 1);
					}
				} else {
				    //一级分类没有二级分类的情况 设为空
					// #ifdef H5
					this.classifyArr[column] = [
						// {
						// 	name: "---",
						// 	objId: "",
						// }
					];
					this.$forceUpdate();
					// #endif
					// #ifndef H5
					this.$set(this.classifyArr, column, [
						// {
						// 	name: "---",
						// 	objId: "",
						// }
					]);
					// #endif
				}
			} catch(e){
				//TODO handle the exception
			}
		},

        //选择分类，获取分类进行展示
		classifyChange(e){
			this.classify2Obj = {};
			this.classify1Obj = {};
			this.classifyIndex = e.detail.value
			if (this.classifyArr[1].length != 0) {
			   this.classify2Obj = this.classifyArr[1][this.classifyIndex[1]];
			};
			if (this.classifyArr[0].length != 0) {
				this.classify1Obj = this.classifyArr[0][this.classifyIndex[0]];
			};			  
		},		
		//一级分类进行选择时，获取二级分类
		columnchange(e){
			let column = e.detail.column;
			if(column == 0){
				let value = e.detail.value
				let childId = this.classifyArr[0][value].objId;
				this.getCategory(childId, 1);
			}
		},

请求信息