vue + vux 使用Picker 组件的时候 使用onchange事件 的问题 求帮忙（有详细内容）

Question

vue + vux 使用Picker 组件的时候 使用onchange事件 的问题

这是一个城市联动的例子
因为要先获取省 再获取市
而不是一次性拉取数据 所以我在picker的change事件中 进行获取数据 但是这样又会导致 每次动态获取数据后赋值 也会触发onchange 事件 这样会变成一个循环 不停的请求 更新视图
正常应该怎样去做呢 求帮忙啊 各位大神

<template>
    <div>
         <group>
             <picker :data='citySelect' v-model='city' @on-change='change'></picker>
         </group>
         

    </div>
</template>
<script>
import {Picker,Group} from 'vux'
   export default{
       data(){
        return {
        citySelect: [
            [{
                name:"北京",
                value:1
            }],
            [{
                name:"北京",
                value:1
            }]
        ],
         city: ['',],
         }
       },
       methods : {
        change(value){
        
                  let url = 'api/mortgage/'+value[0]+'/cityList'
                  console.log(url)
                  this.$axios(url,'get').then(res=>{
                  let data =res.data.data
                  let arr =[]
                  for (let i in res.data.data){
                         let data = {}
                         data.value = res.data.data[i].city_id
                         data.name= res.data.data[i].city_name
                         arr.push(data)
                     }

                          this.citySelect[1] = arr
                     this.$set(this.citySelect,1,arr)
                     console.log(this.citySelect)
                  })      
        }
       },
       mounted(){
        //    数据初始化
        let url ='api/mortgage/provList'
           this.$axios(url,'get').then(res=>{
            //    console.log(res.data.data)
            
            //     console.log(this.citySelect)
            let arr =[]
            for (let i in res.data.data){
                let data = {
                    value:'',
                    name:""
                }
                data.value = i
                data.name= res.data.data[i]
                arr.push(data)
            }
               this.$set(this.citySelect,0,arr)
             
           })
            let url2 = 'api/mortgage/'+1+'/cityList'
                 this.$axios(url2,'get').then(res=>{
                 let arr =[]
                 for (let i in res.data.data){
                        let data = {
                             value:'',
                             name:""
                        }
                        data.value = res.data.data[i].city_id
                        data.name= res.data.data[i].city_name
                        arr.push(data)
                    }
                        // this.citySelect[1] = arr
                    this.$set(this.citySelect,1,arr)
                 })
       },
       created() {
          
        },
        components:{
        Picker,Group
        }
}
</script>
         

Answer 1

如果不能再一开始就可以获取全部省市数据的话，建议使用两个PopupPicker组件，这样可以在选择了省之后触发事件，根据省来获取相应的所需的市的数据

Answer 2

如果发现了该节点的子节点已经存在了，就不去请求。只有在子节点为空的时候去请求呢。