基于vue3和element-plus的省市区级联组件

news2024/11/25 11:55:03

git地址:https://github.com/ht-sauce/elui-china-area-dht
使用:npm i elui-china-area-dht
默认使用
在这里插入图片描述
使用方法

<template>
  <div class="app">
    <!--默认使用-->
    <elui-china-area-dht @change="onChange"></elui-china-area-dht>
    <!--带isall参数和leave参数示例-->
    <elui-china-area-dht isall :leave="2" @change="onChange"></elui-china-area-dht>
  </div>
</template>

<script>
import { defineComponent } from 'vue'
import { EluiChinaAreaDht } from 'elui-china-area-dht'
const chinaData = new EluiChinaAreaDht.ChinaArea().chinaAreaflat
export default defineComponent({
    components: {
        EluiChinaAreaDht,
    },
    setup() {
        function onChange(e) {
          const one = chinaData[e[0]]
          const two = chinaData[e[1]]
          console.log(one, two)
        }
        return {
            onChange,
        }
    },
})
</script>

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

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

相关文章

【android12-linux-5.1】【ST芯片】【RK3588】【LSM6DSR】HAL源码分析

一、环境介绍 RK3588主板搭载Android12操作系统,内核是Linux5.10,使用ST的六轴传感器LSM6DSR芯片。 二、芯片介绍 LSM6DSR是一款加速度和角速度(陀螺仪)六轴传感器,还内置了一个温度传感器。该芯片可以选择I2C,SPI通讯,还有可编程终端,可以后置摄像头等设备,功能是很…

MySQL阻塞与死锁

MySQL阻塞与死锁 阻塞 因为不同锁之间的兼容性关系&#xff0c;在有些时刻一个事务中的锁需要等待另一个事务中的锁释放它所占用的资源&#xff0c;这就是阻塞。 # 查看等待时间 show variables like innodb_lock_wait_timeout; SETinnodb_lock_wait_timeout60; # 是否在等待…

深度学习面试八股文(2023.9.06持续更新)

一、优化器 1、SGD是什么&#xff1f; 批梯度下降&#xff08;Batch gradient descent&#xff09;&#xff1a;遍历全部数据集算一次损失函数&#xff0c;计算量开销大&#xff0c;计算速度慢&#xff0c;不支持在线学习。随机梯度下降&#xff08;Stochastic gradient desc…

【HTML/CSS】入门导学篇

本文属于HTML/CSS专栏文章&#xff0c;适合WEB前端开发入门学习&#xff0c;如果有所帮助请一键三连支持&#xff0c;对博主系列文章感兴趣点击下方专栏了解详细。 本文内容出自B站pink老师的前端入门教程&#xff0c;感谢pink老师&#xff01;&#xff01;&#xff01; 视频链…

【ARM CoreLink 系列 1 -- CoreLink 系列 产品介绍】

文章目录 ARM CoreLink 介绍ARM CoreLink InterconnectARM CoreLink 处理器外设ARM CoreLink Memory Controllers ARM CoreLink 介绍 ARM的CoreLink系列产品是一套能够进行高效互联的组件和工具&#xff0c;它们用于构建高性能、低功耗的嵌入式和消费电子设备。CoreLink产品系…

Mac MySQL初始登录root报错access denied解决方法

如图&#xff0c;当在mac m2上首次安装mysql后尝试登录root用户时&#xff0c;无论输入什么样的密码&#xff0c;或者直接回车键&#xff0c;都会显示access denied for user rootlocalhost。同时win和ubuntu也出现了一模一样的问题&#xff0c;先记录一下mac的解决方法。 参考…

Sigrity仿真报错:找不到电容的S参数?

很多电子工程师会选择使用Sigrity软件进行高速PCB信号仿真&#xff0c;但在使用过程可能会遇见报错情况&#xff0c;其中之一是提示找不到电容的S参数&#xff0c;那么如何解决这个问题&#xff1f; 一般来说&#xff0c;S参数的全称为Scatter参数&#xff0c;即散射参数&#…

STM32单片机OLED贪吃蛇游戏记分计时

实践制作DIY- GC00165---OLED贪吃蛇游戏 一、功能说明&#xff1a; 基于STM32单片机设计---OLED贪吃蛇游戏 二、功能说明&#xff1a; STM32F103C系列最小系统板0.96寸OLED显示器上、下、左、右4个按键 1.通过OLED配合按键实现贪吃蛇游戏 2.可以上下左右移动。 3.可以统计显…

JavaScript-----DOM元素

目录 前言&#xff1a; 1. DOM介绍 2. 获取节点 3. 操作HTML内容 4. 监听事件 案例 5. 操作节点的标签属性 6. 操作样式 7. 创建、添加、删除节点 前言&#xff1a; 在此之前我们要想去操作网页元素一般是去通过CSS选择器实现的&#xff0c;今天我们就学习JavaScript里…

bit、bin 、mcs文件区别

FPGA里面的可执行文件都涉及到 *.bit&#xff0c; *.mcs&#xff0c; *.bin 和 *.elf。 bit文件 bit 文件一般用于JTAG在线进行调试的时候&#xff0c;是把bit文件是烧写到FPGA中进行在线调试。 bin文件 bin 文件是二进制文件&#xff0c;按顺序只包含原始字节流&#xff0c…

74HC595

简介 74HC595 是一个 8 位串行输入、并行输出的位移缓存器&#xff0c;其中并行输出为三 态输出&#xff08;即高电平、低电平和高阻抗&#xff09; 15 和 1 到 7 脚 QA--QH&#xff1a;并行数据输出 9 脚 QH 非&#xff1a;串行数据输出 10 脚 SCLK 非&#xff08; MR&#…

【UE 材质】制作飘动的旗帜

效果 步骤 1. 首先在建模软件中创建一个平面&#xff0c;注意分段数一定要多 2. 在UE中创建一个材质&#xff0c;这里命名为“Mat_Flag” 打开“Mat_Flag”&#xff0c;先将旗帜纹理连接到基础颜色 先选中导入的模型然后点击根据选中的模型预览材质 创建如下节点可以看到此时模…

本地开发环境大小写不敏感引发的问题

推荐阅读 大小写敏感知多少[1] 文件大小写与文件系统有关&#xff0c;与操作系统无关。 血泪教训--拿到新移动硬盘该做的第一件事[2] MacOS 默认的文件系统APFS&#xff0c;如果没有手动更改&#xff0c;默认不区分大小写(可以在初始化时设置为大小写敏感)。 而公司测试/生产环…

AOSP和AAOS,向左走还是向右走?

Android Automotive OS&#xff08;AAOS&#xff09;和Android Open-Source Project&#xff08;AOSP&#xff09;之间存在很多混乱。这两个Android版本经常被混淆使用&#xff0c;但它们代表不同的平台和方法。为汽车In-Vehicle Infotainment&#xff08;IVI&#xff09;项目选…

2023CSP-S初赛复习整理

目录 逻辑运算常见运算运算规则运算优先级例题 进制转换十进制转二进制、八进制、十六进制二进制、八进制、十六进制转十进制例题 主定理编程语言概况具体分类 逻辑运算 常见运算 非&#xff1a; n o t not not 即 与&#xff1a; a n d and and 即 ∧ ∧ ∧ 或&#xf…

依赖项的处理与层的创建与注册

依赖项的处理与层的创建与注册 依赖项的处理与层的创建与注册 新问题什么是 layer?layer 的创建与注册 与函数同时创建和绑定单独上传 layer 再绑定函数(推荐) 真正的运行时依赖 注册包的约定与平台强关联的运行时 1. 云端安装依赖2. 本地构建 Amazon Linux 2 容器环境3. 利用…

Nginx__高级进阶篇

目录 Nginx Web服务器 Nginx Proxy服务器 Nginx 邮 件 Nginx Web服务器 Nginx Proxy服务器 代理原理 正向代理&#xff1a;内网客户机通过代理访问互联网。通常要设置代理服务器地址和端口。 反向代理&#xff1a;外网用户通过代理访问内网服务器。内…

解决VSCode下载速度特别慢

背景: 我们在vscode官网下载vocode的时候速度慢得离谱,而且下载会断开,这时候我们需要将下载镜像切换到国内&#xff01; 解决方法 我是用chrome浏览器&#xff0c;点击右上角的三个点按钮&#xff0c;点击下载内容。 如果你是用其他浏览器&#xff0c;可能使用其他方式跳…

“深入理解SpringMVC的注解驱动开发“

目录 引言1. SpringMVC的常用注解2. SpringMVC的参数传递3. SpringMVC的返回值4. SpringMVC页面跳转总结 引言 在现代的Web开发中&#xff0c;SpringMVC已经成为了一个非常流行和强大的框架。它提供了许多注解来简化开发过程&#xff0c;使得我们能够更加专注于业务逻辑的实现…

设置windos电脑开机自动启动chrome浏览器,并且打开指定网页

需求 web项目设置windos电脑开机自动启动chrome浏览器&#xff0c;打开指定网页地址&#xff0c;并设置为全屏显示 解决 使用windos的bat脚本&#xff0c;设置为开机自启动&#xff0c;代码如下 echo off cd /d %~dp0 title Chrome tasklist|find /i "chrome.exe"…