vue+element-ui里面,Cascader 级联选择器如何使用prop里面的children选项?

发布于 2022-09-07 22:29:03 字数 1064 浏览 20 评论 0

在使用element-ui里面,使用Cascader 级联选择器时候,可以调用到children数据,但是无法选中,这种情况要如何解决?

Html代码

  <el-cascader :options="options" v-model="selectedOptions" @change="handleChange" placeholder="请选择实验室" class="content" :props="props">

js代码

 props: {
        value: "name",
        label: "name",
        children: "items"
      },
      
      // 这里是调用接口的数据
 beforeCreate() {
    this.axios
      .post(`/api/services/app/tenant/GetTreeTenant`)
      .then(response => {
        console.log(response.data.result);
        this.options = response.data.result;
      })
      .catch(function(error) {
        console.log(error);
      });
  },

这里是接口返回的数据,主选项是name, children是这个items下面的name
图片描述图片描述

这是实际效果,无法选中其数据
图片描述

这是我期待的效果,选中数据并显示
图片描述

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

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

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

烂柯人 2022-09-14 22:29:03

最后一级items 不应该是空数组

泪之魂 2022-09-14 22:29:03

这种情况考虑数据没有绑定成功,你是在beforeCreate里面请求的数据,建议在created里面获取数据


还有啊 你这个里面还有items 而且是空的 导致会有三级的选项,但第三级选项里面没有数据

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文