elementui 联选择器城市

ElementUI的城市联动选择器可以通过el-cascader组件实现。下面是一个简单的例子：

<template>
  <el-cascader
    v-model="selectedCity"
    :options="options"
    :props="props">
  </el-cascader>
</template>

<script>
export default {
  data() {
    return {
      selectedCity: [],
      options: [
        {
          value: 'beijing',
          label: '北京市',
          children: [
            {
              value: 'dongcheng',
              label: '东城区'
            },
            {
              value: 'xicheng',
              label: '西城区'
            },
            {
              value: 'chaoyang',
              label: '朝阳区'
            }
          ]
        },
        {
          value: 'shanghai',
          label: '上海市',
          children: [
            {
              value: 'huangpu',
              label: '黄浦区'
            },
            {
              value: 'jingan',
              label: '静安区'
            },
            {
              value: 'pudong',
              label: '浦东新区'
            }
          ]
        }
      ],
      props: {
        value: 'value',
        label: 'label',
        children: 'children'
      }
    }
  }
}
</script>

在这个例子中，options数组包含了所有的省份和城市信息，每个省份和城市都是一个对象，包含value、label、children三个属性。value表示该城市的唯一标识，label表示该城市的显示名称，children是一个数组，包含了该城市下的所有子城市。

props属性用于配置组件的数据结构，包含value、label、children三个属性，分别表示选项的唯一标识、显示名称、子选项数组。如果你的数据结构不同，可以通过props属性进行自定义配置。

最后，v-model属性绑定了一个数组selectedCity，用于保存当前选择的城市信息。如果用户选择了“北京市-朝阳区”，selectedCity数组将变成["beijing", "chaoyang"]。