鍍金池/ 問(wèn)答/HTML5  HTML/ vue + vux 使用Picker 組件的時(shí)候 使用onchange事件 的問(wèn)

vue + vux 使用Picker 組件的時(shí)候 使用onchange事件 的問(wèn)題 求幫忙(有詳細(xì)內(nèi)容)

vue + vux 使用Picker 組件的時(shí)候 使用onchange事件 的問(wèn)題

這是一個(gè)城市聯(lián)動(dòng)的例子
因?yàn)橐全@取省 再獲取市
而不是一次性拉取數(shù)據(jù) 所以我在picker的change事件中 進(jìn)行獲取數(shù)據(jù) 但是這樣又會(huì)導(dǎo)致 每次動(dòng)態(tài)獲取數(shù)據(jù)后賦值 也會(huì)觸發(fā)onchange 事件 這樣會(huì)變成一個(gè)循環(huán) 不停的請(qǐng)求 更新視圖
正常應(yīng)該怎樣去做呢 求幫忙啊 各位大神

<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(){
        //    數(shù)據(jù)初始化
        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>
         
回答
編輯回答
小眼睛

如果不能再一開(kāi)始就可以獲取全部省市數(shù)據(jù)的話,建議使用兩個(gè)PopupPicker組件,這樣可以在選擇了省之后觸發(fā)事件,根據(jù)省來(lái)獲取相應(yīng)的所需的市的數(shù)據(jù)

2018年9月8日 13:42
編輯回答
疚幼

如果發(fā)現(xiàn)了該節(jié)點(diǎn)的子節(jié)點(diǎn)已經(jīng)存在了,就不去請(qǐng)求。只有在子節(jié)點(diǎn)為空的時(shí)候去請(qǐng)求呢。

2017年9月17日 00:36