vant 动态查询下拉菜单(可用)

动态查询item项

在这里插入图片描述

<van-form @submit="onSubmit" ref="formRef"><Title title="企业信息" title-line title-size="19" class="ml-[18px] mb-[18px]"></Title><van-cell-group inset class="py-[18px]"><div><field-title title="所属企业" class="ml-4"></field-title><van-fieldv-model="model.companyName"is-linkreadonlyname="所属企业"placeholder="请选择所属企业"@click="showPicker = true":rules="[{ required: true, message: '必填项' }]"@input="getCompanyList(model.companyName)"/><van-popup v-model:show="showPicker" position="bottom" :close-on-click-overlay="false"><div class="w-full text-center mt-4">选择企业</div><van-searchplaceholder="输入企业名称"v-model="model.companyName"@search="onSearch"@update:model-value="getCompanyList"></van-search><van-picker:columns="options"@confirm="onConfirm"@cancel="handCancelPickerCompanyInfo"></van-picker></van-popup></div></van-cell-group><div style="margin: 16px;"><van-button  block type="primary" native-type="submit" :loading="loading" :disabled="loading">注册</van-button></div></van-form>
  const model = ref({companyName: undefined,companyCode: undefined,})const showPicker = ref(false);const onConfirm = ({selectedOptions}) => {model.value.companyName = selectedOptions[0]?.textmodel.value.companyCode = selectedOptions[0]?.value;showPicker.value = false;};function onSearch(value) {getCompanyList(value)}const options = ref<any>([])const loading = ref(false)const loadingSearch = ref(false)function getCompanyList(value: string) {if (!value.length) {options.value = []return}loadingSearch.value = truegetEnterpriseOptionApi(value).then((res) => {options.value = res.rows.map(item => ({text: item.label, value: item.value}))loadingSearch.value = false}).catch((err) => {loadingSearch.value = false})}function handCancelPickerCompanyInfo() {showPicker.value = falseoptions.value = []model.value.companyName = undefined;model.value.companyCode = undefined;}

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/52029.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Python实战项目:天气数据爬取+数据可视化(完整代码)_python爬虫实战

一、选题的背景 随着人们对天气的关注逐渐增加&#xff0c;天气预报数据的获取与可视化成为了当今的热门话题&#xff0c;天气预报我们每天都会关注&#xff0c;天气情况会影响到我们日常的增减衣物、出行安排等。每天的气温、相对湿度、降水量以及风向风速是关注的焦点。通过…

Linux——网络(5)

一、sqlite3性能测试 1. 程序效率测试 时间相关接口&#xff1a; int gettimeofday(struct timeval*tv, struct timezone *tz); 功能&#xff1a;得到从1970年1月1日0时0分0秒到现在的秒数 精度到微妙 参数&#xff1a; tv&#xff1a;…

什么是视频缓存服务器,它有哪些作用?

视频缓存服务器通常拥有大容量的存储空间和高速的读写能力&#xff0c;它通过缓存(即临时存储)用户经常访问的视频内容&#xff0c;来优化内容的分发过程。这种服务器通常部署在网络中的关键位置&#xff0c;如靠近用户接入点的位置&#xff0c;以降低用户访问视频内容时的网络…

维信小程序禁止截屏/录屏

一、维信小程序禁止截屏/录屏 //录屏截屏,禁用wx.setVisualEffectOnCapture({visualEffect:hidden});wx.setVisualEffectOnCapture(Object object) 测试安卓手机&#xff1a; 用户截屏&#xff0c;被禁用 用户录屏&#xff0c;录制的是空白内容/黑色内容的视频。 二、微信小…

鸿蒙系统为什么能安装安卓的APP

鸿蒙系统能够安装安卓的APP&#xff0c;主要得益于其设计理念和技术实现上的几个关键点&#xff1a; 一、设计理念 鸿蒙系统的设计初衷并非完全取代安卓系统&#xff0c;而是与其共存&#xff0c;并建立一个更加广泛的软件生态圈。这一理念体现在鸿蒙系统对安卓应用的兼容性上…

浙大数据结构:01-复杂度2 Maximum Subsequence Sum

数据结构MOOC PTA习题 01-复杂度2 Maximum Subsequence Sum #include <iostream> using namespace std; const int M 100005; int a[M]; int main() {int k;cin >> k;int f 1;for (int i 0; i < k; i){cin >> a[i];if (a[i] > 0)//如果出现大于0则…

【HuggingFace Transformers】OpenAIGPTModel源码解析

OpenAIGPTModel源码解析 1. GPT 介绍2. OpenAIGPTModel类 源码解析 说到ChatGPT&#xff0c;大家可能都使用过吧。2022年&#xff0c;ChatGPT的推出引发了广泛的关注和讨论。这款对话生成模型不仅具备了强大的语言理解和生成能力&#xff0c;还能进行非常自然的对话&#xff0c…

1.初识ChatGPT:AI聊天机器人的革命(1/10)

引言 在当今的数字化世界中&#xff0c;人工智能&#xff08;AI&#xff09;正以其独特的方式重塑我们的生活和工作。其中&#xff0c;AI聊天机器人作为人机交互的前沿技术&#xff0c;已经成为企业与客户沟通、提供个性化服务的重要工具。这些机器人通过模拟人类的对话方式&a…

二、MMRotate旋转框目标检测训练DOTA数据集(模型推理与部署,保存推理结果为xml文件并构建镜像)

在上一篇文章中介绍了MMRotate的概述、安装和训练Dota数据集全流程,由于文章篇幅限制还剩下一部分模型的推理和部署环节没有写,为避免后续对这部分工作的遗忘,决定还是补充上这部分的笔记,仅作记录,如有不足之处还请指出! 一、模型推理测试 1.1单张图片推理测试 可以首…

DataSet和DataTable的关系

C#中的DataTable 在C#中&#xff0c;DataTable 是 System.Data 命名空间下的一个类&#xff0c;它是 DataSet 的一个组件&#xff0c;用于存储表格形式的数据。DataTable 可以独立于数据库使用&#xff0c;也可以与数据库表相关联&#xff0c;用于数据的读取、更新、插入和删除…

LeetCode 热题100-17 缺失的第一个正数

缺失的第一个正数 给你一个未排序的整数数组 nums &#xff0c;请你找出其中没有出现的最小的正整数。 请你实现时间复杂度为 O(n) 并且只使用常数级别额外空间的解决方案。 示例 1&#xff1a; 输入&#xff1a;nums [1,2,0] 输出&#xff1a;3 解释&#xff1a;范围 [1,…

OpenCV绘图函数(13)绘制多边形函数函数polylines()的使用

操作系统&#xff1a;ubuntu22.04 OpenCV版本&#xff1a;OpenCV4.9 IDE:Visual Studio Code 编程语言&#xff1a;C11 算法描述 画几条多边形曲线 函数原型 void cv::polylines (InputOutputArray img,InputArrayOfArrays pts,bool isClosed,const Scalar & color…

【高等代数笔记】(18)N阶行列式

2. N阶行列式 2.12 行列式按k行&#xff08;列&#xff09;展开 【拉普拉斯定理】 n n n阶矩阵 A ( a i j ) \boldsymbol{A}(a_{ij}) A(aij​)&#xff0c;取定第 i 1 , i 2 , . . . , i k i_{1},i_{2},...,i_{k} i1​,i2​,...,ik​行&#xff08;其中 i 1 < i 2 < .…

将x减到零的最小操作数问题

欢迎跳转我的主页&#xff1a;羑悻的小杀马特-CSDN博客 目录 一题目简述&#xff1a; 二题目思路&#xff1a; 三解答代码&#xff1a; 一题目简述&#xff1a; leetcode题目链接&#xff1a;. - 力扣&#xff08;LeetCode&#xff09; 二题目思路&#xff1a; 首先这道题…

STM32(F103ZET6)第十九课:FreeRtos的移植和使用

目录 需求一、FreeRtos简介二、移植FreeRtos1.复制代码2.内存空间分配和内核相关接口3.FreeRtosConfig4.添加到工程中三、任务块操作1.任务四种状态2.创建任务过程 需求 1.将FreeRtos&#xff08;嵌入式实时操作系统&#xff09;移植到STM32中。 2.在该系统中实现任务的创建、…

git 更改分支名称

1. 本地分支重命名&#xff08;还未推送到远程&#xff09; 1、修改当前分支名称 git branch -m 新分支名称2、修改其他分支名称 git branch -m 旧分支名称 新分支名称2. 远程分支重命名&#xff08;已推送远程&#xff09; 1&#xff09;重新命名远程分支对应的本地分支 …

86、pod部署策略

一、集群的调度 集群的调度&#xff1a; 怎么把pod部署到节点的方法。 1.1、调度的过程&#xff1a; scheduler是集群的调度器&#xff0c;主要任务就是把pod部署到节点上。 1.2、自动调度&#xff1a; 1、公平&#xff0c;保证每个可用的节点都可以部署pod 2、资源的高…

【生日视频制作】黑板写文字美女跳舞2版AE模板修改文字软件生成器教程特效素材【AE模板】

生日视频制作教程黑板写文字美女跳舞2版AE模板修改文字特效广软件告生成神器素材祝福玩法AE模板替换工程 怎么如何做的【生日视频制作】黑板写文字美女跳舞2版AE模板修改文字软件生成器教程特效素材【AE模板】 生日视频制作步骤&#xff1a; 安装AE软件 下载AE模板 把AE模板导…

有向无环图的关联矩阵及其矩阵乘积的含义

有向无环图的关联矩阵及其矩阵乘积的含义 引言关联矩阵的定义矩阵乘积 B B T BB^T BBT的含义伪代码示例C代码示例结论引言 在计算机科学和数学中,有向无环图(Directed Acyclic Graph, DAG)是一种常见的数据结构,广泛应用于各种算法中,如拓扑排序、动态规划等。在有向无环…

10、Django Admin修改标题

admin from django.contrib import admin from .models import Category, Origin, Hero, Villain # 添加以下代码 admin.site.site_header "系统管理" admin.site.site_title "管理员界面" admin.site.index_title "欢迎来到这里&#xff…