0
点赞
收藏
分享

微信扫一扫

Kotlin标准函数和静态方法

小布_cvg 2024-05-14 阅读 7

本方法是使用第三方库

1.下载全省市区的数据

npm install element-china-area-data -S
  • 如果使用vscode运行报错,就使用管理员打开cmd来到你前端对应的文件夹位置
  • 再次执行该命令

2.下载完成后导入使用

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

  • 可按需引用,也可全部引用

3.具体使用

  • 只需要注意return里的两个变量
  • 我使用的是纯汉字传入后端
export default {
  name: "Code",
  dicts: ['base_status'],
  data () {
    return {
      pcaTextArr,
      selectedOptions: [],
  • 表单导入使用
  • 我是在后端处理该数据的,所以v-model="form.addressArray"
        <el-form-item
          label="客户地址"
          prop="addressArray"
        >
          <template>
            <div id="app">
              <el-cascader
                size="large"
                :options="pcaTextArr"
                v-model="form.addressArray" // 前端处理请绑定selectedOptions
                clearable
              >
              </el-cascader>
            </div>
          </template>

        </el-form-item>
  • 格式:
    在这里插入图片描述

4.数据处理

传入后端的数据格式是数组

  • 比如["北京市","市辖区","东城区"]
  • 如果后端是字符串接该变量,就需要前端使用join方法处理你接收变量的数组selectedOptions
  • 如果后端实体类是用String[]接可以在后端使用String.join处理成字符串拼接,
  • 或者分为多个列(省、市、区列)的表分别插入

  • 我的处理方式,用addressArray接收,处理后放入address存入数据库
    在这里插入图片描述
    该组件体验链接:级联选择器
举报

相关推荐

0 条评论