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
}
相关推荐
小北方城市网2 分钟前
JavaScript 实战 —— 实现一个简易的 TodoList(适合前端入门 / 进阶)
开发语言·前端·javascript
是上好佳佳佳呀3 分钟前
【前端(二)】CSS 知识梳理:从编写位置到选择器优先级
前端·css
倾颜28 分钟前
我是怎么把单 Tool Calling 升级成多 Tool Runtime 的
前端·后端·langchain
清汤饺子35 分钟前
Superpowers:给 AI 编程 Agent 装上"工程化超能力"
前端·javascript·后端
踩着两条虫36 分钟前
AI驱动的Vue3应用开发平台 深入探究(十三):物料系统之区块与页面模板
前端·vue.js·人工智能·架构·系统架构
weixin199701080161 小时前
《得物商品详情页前端性能优化实战》
前端·性能优化
帮我吧智能服务平台1 小时前
装备制造企业售后服务数字化:从成本中心到利润中心背景
java·前端·制造
qq_368019661 小时前
用 react 的react-syntax-highlighter 实现语法高亮、行号与多行错误行高亮
前端·react.js·前端框架
lbh1 小时前
从LLM到Agent的核心概念
前端·openai·ai编程
Irene19911 小时前
JavaScript脚本加载的两种方式:defer/async 的区别
前端·javascript·php