spring boot +vue 实现三级联动

基于vue三级联动下拉框

<template>
  <div id='addAddress'>
    <div class="content">
        <span class="title">省</span>
        <select v-model="selectedProvince" @change='getCity(selectedProvince)'>
          <option value="0">-- 请选择 --</option>
          <option :value="province" v-for='(province,index) in regin' :key='index'>{
  {province.name}}</option>
        </select>
        <span class="title">市</span>
        <select v-model="selectedCity" @change='getCountry(selectedCity)'>
          <option value="0">-- 请选择 --</option>
          <option :value="city" v-for='(city,index) in cityList' :key='index'>{
  {city.name}}</option>
        </select>
        <span class="title">县</span>
        <select v-model="selectedCountry" @change='getChild(selectedCountry)'>
          <option value="0">-- 请选择 --</option>
          <option :value="country" v-for='(country,index) in countryList' :key='index'>{
  {country.name}}</option>
        </select>
      </div>
    <div class="border"></div>
  </div>
</template>
<script>
  const axios = require('axios')
  export default{
    
    name:'addAddress',
    data(){
    
      return{
    
        value:true,  //是否设置为默认
        regin:[{
    
          base_areaid:1,
          name: '北京市',
          nodes: [{
    
            base_areaid: 7180682,
            name: '北京市',
            nodes:[{