uview 中u-select选中时默认的选择状态聚焦

最新推荐文章于 2026-06-22 16:58:36 发布

原创

最新推荐文章于 2026-06-22 16:58:36 发布 · 5k 阅读

这篇博客介绍了在Vue中使用u-select组件时如何设置默认选中的状态。通过在data中定义初始值`dafautValue`，并在`selectTrue`方法中更新选中项，实现了选择器关闭时保留选定的业务员信息。点击‘选择业务员’显示选择器，选择后将业务员ID和名称同步到相应数据属性。

开发板推荐：天空星STM32F407VET6开发板

超高性价比 STM32主控 | 超高主频 | 一板兼容百芯 | 比赛神器 | 沉金彩色丝印

点击查看

效果如下：使用u-select 时，默认选中的状态设置；

设置实现：

<view class="stork-shaixuan iconfont">
					<view class="ware-select" @click="selectarea('salesman')">
						{
  
  { salesmantext || '选择业务员'}}
					</view>
				</view>

<!-- 选择器 -->
		<u-select v-model="slideShow" :default-value="dafautValue" :mode="mode" class="selectware-slide" :list="salesList" @confirm="selectTrue"></u-select>

data() {
			 return {
				dafautValue: [0],
				mode: 'single-column',
				slideShow: false, // 业务员，
				salesmantext: "", // 选择业务员
				Params: {
					manage_id: '', //业务员ID
				},
				salesList: [{
					value: '',
					label: '全部'
				}], // 选择业务员  		
			};
		},  

methods: {       

             // 选择弹窗 业务员
			async selectarea(status) {
				this.slid

开发板推荐：天空星STM32F407VET6开发板

超高性价比 STM32主控 | 超高主频 | 一板兼容百芯 | 比赛神器 | 沉金彩色丝印

点击查看