uview select单列选择器开发实战

最新推荐文章于 2025-04-10 15:24:51 发布

科技猿说

最新推荐文章于 2025-04-10 15:24:51 发布

阅读量7.2k

点赞数 5

分类专栏： uview代码改造

本文链接：https://blog.youkuaiyun.com/weixin_44089042/article/details/113181763

版权

这篇博客详细介绍了如何在开发中应用uView UI的选择器组件。首先，讲解了如何添加选择器按钮并实现点击弹出效果。接着，重点讨论了如何将选择器的内容与数据库字段（IndustryID, IndustryName）对应，以实现动态数据加载。最后，展示了实际的实现效果。" 81278697,7875661,Java语言中的流程控制结构,"['Java语言', '程序设计', '流程控制']

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

uview select单列选择器开发实战

一、添加一个选择器按钮，点击弹出框

<template>
<view>
	<u-select v-model="show" mode="single-column" :list="list" @confirm="confirm">
		<!-- <button type="primary" @click="show = true"  >点击下拉</button> -->
	</u-select>

	 <u-form-item :label-position="labelPosition"  label-width="150" label="主营行业" prop="bb">
	 	<u-input :border="border" type="select"  v-model="bb" placeholder="请选择行业"
	 	 @click="show = true"></u-input>
	 </u-form-item>

</view>
</template>

<script>
	export default {
		data() {
			return {
				show: false,
				IndustryName:'',
				bb:'',
				list: [
					{
						value: '1',
						label: '江'
					},
					{
						valu