uniapp:uni-combox下拉选中之后下拉框只有被选中项 问题解决

关于uni-combox的基础用法在此处不赘述,下面是官网上给出的示例:
选中之后必须手动清空了输入框内容才可以再次选择其他选项,非常不方便
示例1
去插件市场看了下有基于uniui实现的,突发奇想,我们也可以自己改呀~
查看uni-combox的组件,修改原代码。
实现效果如下:
请添加图片描述

请添加图片描述
如果对下拉选择功能要求不是很多的,可以采用以下代码(复制直接替换掉uni-combox.vue的代码):

<template>
	<view class="uni-combox">
		<view v-if="label" class="uni-combox__label" :style="labelStyle">
			<text>{
   {
   label}}</text>
		</view>
		<view class="uni-combox__input-box">
			<input class="uni-combox__input" type="text" :placeholder="placeholder" v-model="inputVal" @input="onInput" @focus="onFocus" @blur="onBlur" />
			<uni-icons class="uni-combox__input-arrow" :type="showSelector ? 'arrowup' : 'arrowdown'" size="14" @click="toggleSelector"></uni-icons>
			<view class="uni-combox__selector" v-if="showSelector">
				<scroll-view scroll-y="true" class="uni-combox__selector-scroll">
					<view class="uni-combox__selector-empty" v-if="filterCandidatesLength === 0"
评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值