vant 里面的picker组件请求地址的时候第二数据拿到了但是列表不渲染?

发布于 2022-09-17 23:18:56 字数 1966 浏览 21 评论 0

<van-popup v-model="showPicker" round position="bottom">

  <van-picker
    show-toolbar
    value-key="cityName"
    :columns="columns"
    @cancel="showPicker = false"
    @confirm="onConfirm"
    @change="search"
  />
</van-popup>

调用接口请求地区数据,初始化列表
created() {

// 获取省
this.axios
  .post("")
  .then((response) => {
    let data = response.data;
    this.columns[0].values = data.resultInfo;
  })
  .catch((error) => {
    console.log(error);
  });
// 获取市
this.axios
  .post("", {
    parentCode: "110000",
  })
  .then((response) => {
    let data = response.data;

    this.columns[1].values = data.resultInfo;
  })
  .catch((error) => {
    console.log(error);
  });
// 获取区
this.axios
  .post("", {
    parentCode: "110000",
  })
  .then((response) => {
    let data = response.data;
    this.columns[2].values = data.resultInfo;
  })
  .catch((error) => {
    console.log(error);
  });

},
第一列数据改变的时候
methods: {

search(picker, value, index) {
  console.log(value[0], "选中的省");
  console.log(value[1], "选中的市");
  console.log(value[2], "选中的区");
  // 获取市
  this.axios
    .post("", {
      parentCode: value[0].cityCode
    })
    .then(response => {
      let data = response.data;

      this.columns[1].values = data.resultInfo;
    })
    .catch(error => {
      console.log(error);
    });
  // 获取区
  this.axios
    .post("", {
      parentCode: value[1].cityCode
    })
    .then(response => {
      let data = response.data;
      this.columns[2].values = data.resultInfo;
    })
    .catch(error => {
      console.log(error);
    });
  this.$emit("input", this.value);
},
onConfirm(e) {
  console.log(e, "确认");
  this.showPicker = false;
  console.log(this.columns);
  // this.value.area = e[0].cityName + e[1].cityName + e[2].cityName;
}

}

image.png

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文