uniapp下拉框点击查询数据

先导入插件下拉框多选单选
返回按钮下载地址阿里巴巴矢量图
下面的range-key="stationName"里的stationName是下拉框显示的内容

<view id="data">
		<view class="up">
			<span class="title">登录哈哈哈哈售电系统</span>
			<view class="img1" @click="Tuichu()"></view> //点击返回登录页面
		</view>
		<!-- 下拉框 -->
		<view class="data2">
			<view class="tubiao"></view>
			<text style="font-size: 15px;color: #798ea9;">测点管理：</text>
			<view class="select">
				<picker mode="selector" :range="schoolList" range-key="stationName" @change="schoolChange">
					<span style="margin-left: 10px;">{{before_school? before_school: '请选择' }}</span>
				</picker>
			</view>
		</view>
	</view>

data() {
			return {
				userid:'', //从登录页面传递过来的userid
				index: 0,
				shuju: [{}],
				// 在picker列表所选中项的befor_school
				before_school: '',
				// 在picker列表所选中项的id
				sid: '',
				// 学校列表（假数据，可以在getSchoolList函数里面发请求获取真实的业务后台数据）
				schoolList: [{
					id: 1,
					school_name: '西京学院'
				}, ]
			}
		},

mounted() {
		 this.userid = localStorage.getItem('USERID');
		 this.getSchoolList()
		},

	methods: {
		// 获取学校数据列表
		getSchoolList() {
			uni.request({
				url: 'ip/GetStationName?userId='+this.userid, //仅为示例，并非真实接口地址。
				method: 'GET',
				success: (res) => {
					console.log(res.data);
					this.schoolList = res.data.result;
				}
			});
		},
		//点击后传递数值的地方
		schoolChange(e) {
			const index = e.target.value
			this.before_school = this.schoolList[index].stationName
			this.sid = this.schoolList[index].id
			uni.request({
				url: 'ip/selectParamter?stationId='+this.sid, //仅为示例，并非真实接口地址。
				method: 'GET',
				header: {
					'Content-type': 'application/x-www-form-urlencoded'
				},
				success: (res) => {
					console.log(res)
				}
			});
		},
		//点击按钮返回主页面
			Tuichu(){
				uni.redirectTo({
				    url: './index'
				});
			}
			
		},

css

#data{
		width: 100%;
		height: 1400rpx;
		background-color: pink;
		}
		.up{
			width: 100%;
			height: 100rpx;
			background-color: #184a7f;
			display: flex;
			align-items: center;
		}
		.title{
			color: #FFFFFF;
			font-size: 15px;
			
		}
		.img1{
			width: 5%;
			height: 40rpx;
			margin-left: 50%;
			background-image: url(../../static/main/tuichu.png);
			background-position: center;
			background-repeat: no-repeat;
			background-size: 100% 100%;
		}
	/* 下拉框 */
	uni-view.data2 {
		width: 90%;
		height: 53px;
		color: white;
		margin-top: 20px;
		margin-left: 5%;
	}
    .select {
		width: 70%;
		float: right;
		height: 24px;
		color: #FFFFFF !important;
		border: #b7d4e6 solid 1px !important;
		font-weight: 420;
	}
.tubiao{
	width: 6%;
	height: 40rpx;
	float: left;
	background-image: url(../../static/main/cedian.png); //图片路径换成自己的
	background-position: center;
	background-repeat: no-repeat;
	background-size: 80% 80%;
}