vant 区域选择多级联动

基于vant实现的移动端多级联动

通过 field-names 属性可以自定义 options 里的字段名称。
还有一些属性 (https://vant-contrib.gitee.io/vant/#/zh-CN/cascader#yin-ru)

<template>
  <div class="wrap">
    <van-field v-model="fieldValue" is-link readonly label="地区" placeholder="请选择所在地区" @click="show = true" />
    <van-popup v-model="show" round position="bottom" active-color="#1989fa" :field-names="fieldNames">
      <van-cascader v-model="cascaderValue" title="请选择所在地区" :options="options" @close="show = false" @finish="onFinish" active-color="#1989fa" />
    </van-popup>

  </div>
</template>
<script>
export default {
  data() {
    return {
      show: false,
      fieldValue: "",
      cascaderValue: "",