uni-app:firstUI框架的选择器Select改造,添加一个搜索的插槽

html 复制代码
<fui-select :show="showSiteType" :options="siteTypeList" textKey="dict_label" title="请选择站点类型"
@confirm="chooseSiteType" @close="onCloseSiteType">
	<template v-slot:search>
		<view>
			<fui-search-bar background="#ffffff" inputBackground="#FAFAFA"
				@search="searchSiteType"></fui-search-bar>
		</view>
	</template>
</fui-select>
javascript 复制代码
const showSiteType = ref(false) //站点类型选择
// 站点类型
function getSiteTypeList(key) {
	api.getSiteTypeList({
		keyworld: key,
	}).then(res => {
		if (res.code == 200) {
			console.log(res);
			siteTypeList.value = res.data
		}
	})
}

function searchSiteType(e) {
	let key = e.detail.value
	getSiteTypeList(key)
}

function chooseSiteType(e) {
	state.type_id = e.options.dict_value//站点类型id
	state.typeIdName = e.options.dict_label//站点类型名称
	onCloseSiteType()
}

function onCloseSiteType() {
	showSiteType.value = false
}
相关推荐
Code Crafter17 分钟前
ES6-ES14 新特性速查
前端·ecmascript·es6
Lhuu(重开版18 分钟前
CSS从0到1
前端·css·tensorflow
不说别的就是很菜1 小时前
【前端面试】HTML篇
前端·html
前端一小卒2 小时前
生产环境Sourcemap策略:从苹果事故看前端构建安全架构设计
前端·javascript
im_AMBER2 小时前
React 18
前端·javascript·笔记·学习·react.js·前端框架
老前端的功夫2 小时前
Vue2中key的深度解析:Diff算法的性能优化之道
前端·javascript·vue.js·算法·性能优化
han_2 小时前
前端高频面试题之Vue(高级篇)
前端·vue.js·面试
不说别的就是很菜3 小时前
【前端面试】CSS篇
前端·css·面试
by__csdn3 小时前
nvm安装部分node版本后没有npm的问题(14及以下版本)
前端·npm·node.js
by__csdn3 小时前
Node与Npm国内最新镜像配置(淘宝镜像/清华大学镜像)
前端·npm·node.js