airyland / vux

Mobile UI Components based on Vue & WeUI
https://vux.li
MIT License
17.59k stars 3.71k forks source link

[Bug Report] popup-picker 组件异步请求数据,不渲染 #3018

Open lance-yi opened 6 years ago

lance-yi commented 6 years ago

VUX version

2.9.2

OS/Browsers version

Windows Google浏览器

Vue version

2.5.2

Code

文件index.vue  
<template>
<group class="rf-28 citys" label-width="4.5rem" label-margin-right="1em" label-align="right">
        <popup-picker 
          :title="cityTitle" 
          :data="citysList" 
          v-model="cityValue"
          value-text-align="left">
        </popup-picker>
      </group>
</template>
export default {
data(){
    return{
      cityTitle: '18-07-08',
      cityValue:[],
      citysList: [],
    }
  },
 methods:{
    /**
     * parentId: 父级id,默认为0
     * type: 子节点类型 省:province 市:city 区:district
     */
    getChildCitys(id,type){
      this.$api.get(this.$interface.apiurl.getChildCitys,{
        parentId: id,
        type: type
      },res=>{
        console.log(res);
        if(type === 'province'){
          this.nowProvince = res.data;
          this.citysList[0] = []; 
          this.getChildCitys(res.data[0].id,"city");
          this.$nextTick(()=>{
            for (let i = 0; i < res.data.length; i  ) {
              this.citysList[0].push(res.data[i].name);
            }
          })
        }else if(type === 'city'){
          this.citysList[1] = []; 
         this.$nextTick(()=>{
            for (let i = 0; i < res.data.length; i  ) {
                this.citysList[1].push(res.data[i].name);
             }
          })
        }
      })
    }

  },
activated() {
    this.getChildCitys(0,'province');
  },
}

Steps to reproduce

进入页面,点击popup-picker

What is Expected?

数据正常渲染

What is actually happening?

数据不正常渲染

lance-yi commented 6 years ago

image 获取数据图片