使用element UI Cascader 级联选择器实现省/市/区选择

news2024/11/13 7:54:54

 

<template>
  <div>
    <label>位置</label>
    <el-cascader
      :options="pcaTextArr"
      v-model="selectedOptions"
      @change="handleChangeAddress"
      :props="{
        expandTrigger: 'hover',
        multiple: true,
        checkStrictly: true,
        emitPath: false,
      }"
    >
    </el-cascader>
  </div>
</template>
<script>
import { pcaTextArr } from "element-china-area-data"; //安装中国城市地区级联菜单数组 npm install element-china-area-data

export default {
  data() {
    return {
      pcaTextArr, //地址数据
      selectedOptions: [],
    };
  },
  methods: {
    handleChangeAddress(d) {},
  },
};
</script>

import {  provinceAndCityData, pcTextArr, regionData, pcaTextArr, codeToText ,} from "element-china-area-data";

这里面的

      provinceAndCityData, pcTextArr, regionData,  codeToText ,

有不同的数据内容,可以慢慢发掘

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

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

相关文章

windows 打包pyd文件

1.新建一个py文件&#xff0c;myunit.py&#xff0c;里面的代码是: class Adder: def __init__(self, a, b): self.a a self.b b def add(self): return self.a self.b 2.新建一个py文件&#xff0c;setup.py&#xff0c;里面的代码是: from setuptools import setup fro…

完整教程 linux下安装百度网盘以及相关依赖库,安装完成之后启动没反应 或者 报错

完整教程 linux下安装百度网盘以及相关依赖库&#xff0c;安装完成之后启动没反应 或者 报错。 配置国内镜像源&#xff1a; yum -y install wget mv /etc/yum.repos.d/CentOS-Base.repo /etc/yum.repos.d/CentOS-Base.repo.bak wget -O /etc/yum.repos.d/CentOS-Base.repo ht…

MySQL运维实战之Clone插件(10.1)使用Clone插件

作者&#xff1a;俊达 clone插件介绍 mysql 8.0.17版本引入了clone插件。使用clone插件可以对本地l或远程的mysql实例进行clone操作。clone插件会拷贝innodb存储引擎表&#xff0c;clone得到的是原数据库的一个一致性的快照&#xff0c;可以使用该快照数据来启动新的实例。cl…

服务器基础2

服务器基础复习02 1.网络管理 nmcli nmcli是NetworkManager的一个命令行工具&#xff0c;它提供了使用命令行配置由NetworkManager管理网络连接的方法。nmcli命令的基本格式为&#xff1a; nmcli [OPTIONS] OBJECT { COMMAND | help }其中&#xff0c;OBJECT选项可以是genera…

PHP旅游门票预订系统小程序源码

旅游门票预订系统&#xff1a;轻松规划&#xff0c;畅游无忧&#x1f30d; &#x1f3ab;【一键预订&#xff0c;说走就走】 还在为排队购票浪费时间而烦恼吗&#xff1f;旅游门票预订系统让你告别长龙&#xff0c;享受说走就走的旅行&#xff01;只需在手机或电脑上轻轻一点…

通过Dockerfile构建镜像

案例一&#xff1a; 使用Dockerfile构建tomcat镜像 cd /opt mkdir tomcat cd tomcat/ 上传tomcat所需的依赖包 使用tar xf 解压三个压缩包vim Dockerfile FROM centos:7 LABEL function"tomcat image" author"tc" createtime"2024-07-16"ADD j…

橙芯创想:香橙派AIPRO解锁升腾LLM与Stable Diffusion的创意密码

文章目录 引言 一. 香橙派AI PRO配置以及展示优秀的扩展能力实物展示 二、Ascend-LLM模型部署开机xshell连接香橙派实战运行部署运行结果分析开发版表现 三、Stable Diffusion文生图性能表现 四、体验总结性能噪音便捷性 引言 在科技的浪潮中&#xff0c;一场融合智慧与创意的盛…

AI 和平台工程对云原生演进的影响:将云之旅自动化到光速

2024 年和云原生 AI 技术的曙光标志着计算能力的重大飞跃。我们正在经历一个新时代&#xff0c;人工智能 &#xff08;AI&#xff09; 和平台工程融合在一起&#xff0c;改变云计算格局。人工智能现在正在与云计算融合&#xff0c;我们正在经历一个人工智能超越传统界限的时代&…

IDEA实现NPM项目的自打包自发布自部署

目录 前言 正文 操作背景 NPM自发布 Package自发布 NPM部署 尾声 &#x1f52d; Hi,I’m Pleasure1234&#x1f331; I’m currently learning Vue.js,SpringBoot,Computer Security and so on.&#x1f46f; I’m studying in University of Nottingham Ningbo China&#x1f…

【软件测试】RobotFramework常见问题如何解决 ?

附加-问题解决 1. 执行robot用例的时候提示WebDriverException: Message: invalid argument: cant kill an exited process 查看驱动的log是否是提示 如果是的话&#xff0c;参照第七步安装图形界面 2. jenkins启动后发现打不开jenkins页面的问题解决 打开jenkins页面提…

变频器CE认证如何办理?

随着国际贸易的蓬勃发展&#xff0c;现在越来越多的企业开始将自己的产品销往欧洲市场。然而&#xff0c;要想在欧洲市场上站稳脚跟&#xff0c;产品必须满足一系列的安全和性能标准。其中&#xff0c;CE认证是进入欧洲市场的“通行证”&#xff0c;对于变频器这类电气产品来说…

Java实验4

实验内容 考试题 要求在一个界面内至少显示5道选择题&#xff0c;每道题4个选项。题目从数据库读取。表结构自定义。 另有2个命令按钮&#xff0c;分别为“重新答题”&#xff08;全部选项及正确答题数清空&#xff09;和“提交”&#xff08;计算&#xff09;&#xff0c;在…

2024最新最全MidJourney新手入门教程 参数设置教程

文章目录 MJ的基本使用提示词基本提示高级提示提示说明提示词分类Vary Region多提示分割 MJ 命令blenddescribeinfosettingshorten MJ 参数Aspect Ratios 横纵比Chaos 混乱程度Character Reference 引用图像no 不包含Quality 质量Repeat 重复Seeds 种子Stop 停止Sytle 风格Styl…

W外链创建抖音私信卡片教程,私信卡片跳转微信工具

W外链地址wai.cn 在数字化时代的浪潮中&#xff0c;私域流量的价值愈发凸显&#xff0c;成为企业获取用户、建立品牌忠诚度、提升转化率的关键手段。抖音&#xff0c;作为当下最热门的短视频社交平台之一&#xff0c;其用户基数庞大、互动性强&#xff0c;为企业私域引流提供了…

自己搭建邮件服务器时如何保障数据安全性?

自己搭建邮件服务器的要求&#xff1f;如何正确配置邮件服务器&#xff1f; 自己搭建邮件服务器成为许多企业和个人用户的选择&#xff0c;以实现更高的自主性和定制化需求。下面&#xff0c;AokSend将从几个方面探讨如何在自己搭建邮件服务器的过程中&#xff0c;有效保障数据…

哈默纳科HarmonicDrive减速机组装注意事项

在机械行业中&#xff0c;精密传动设备HarmonicDrive减速机对于维持机械运作的稳定性和高效性起着至关重要的作用。然而在减速机的组装过程中&#xff0c;任何一个细微的错误都可能导致其运转时出现振动、异响等不良现象&#xff0c;严重时甚至可能影响整机的性能。因此&#x…

内衣裤洗衣机有必要买吗?五样超卓臻品专业推荐!

在当今繁忙的生活中&#xff0c;内衣洗衣机已成为我们日常生活中不可或缺的家电。但是&#xff0c;面对市场上众多品牌的内衣洗衣机&#xff0c;那么&#xff0c;到底内衣洗衣机哪个牌子好&#xff1f;本次我将在这篇文章中探讨内衣洗衣机的选购策略&#xff0c;以帮助大家找到…

软件测试好就业吗?软件测试行业的就业前景分析

一、软件测试的重要性 在当今信息化的时代&#xff0c;软件产品的质量至关重要。随着软件行业的蓬勃发展&#xff0c;软件测试作为保障软件质量的关键环节&#xff0c;其重要性日益凸显。软件测试工程师的角色不再仅仅局限于找出软件的缺陷&#xff0c;他们更是软件质量保障的守…

Adobe XD中文设置指南:专业设计师的现场解答

Adobe XD是世界领先的在线合作UI设计工具。它摆脱了Sketch、Figma等传统设计软件对设备的依赖&#xff0c;使设计师可以随时随地使用任何设备打开网页浏览器&#xff0c;轻松实现跨平台、跨时空的设计合作。然后&#xff0c;为了提高国内设计师的使用体验&#xff0c;Adobe XD如…

Django F()函数

F()函数的作用 F()函数在Django中是一个非常强大的工具&#xff0c;主要用于在查询表达式中引用模型的字段。它允许你在数据库层面执行各种操作&#xff0c;而无需将数据加载到Python内存中。这不仅提高了性能&#xff0c;还允许你利用数据库的优化功能。 字段引用 在查询表达…