vue+element cascader联选择器三级类目动态加载

浅浅的花香味﹌ 2022-12-25 09:55 322阅读 0赞

当选中某一级时，动态加载该级下的选项。  
html代码 框里面只显示三级类目 删除:show-all-levels=“false” 就会显示全部路径

<el-form-item label="商品类目：" v-if="navstate==-1">
        <el-cascader v-model="preSearchForm.class" :props="props" :show-all-levels="false"></el-cascader>
     </el-form-item>

js代码 buckleTemplateNext 类目接口名 props 是放在data里面

props: { 
              lazy: true,
              lazyLoad (node, resolve) { 
                const {  level,value } = node;
                buckleTemplateNext({ pid:value || 0}).then(res=>{ 
                  console.log(res)
                  const nodes = res.map(x=>({ 
                    value: x.id,
                    label: x.name,
                    leaf: level >= 2
                  }))
                  resolve(nodes)
                })
              }
            }

## 查看前端面试题 ##

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80Mjk4MTU2MA_size_16_color_FFFFFF_t_70_pic_center]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80Mjk4MTU2MA_size_16_color_FFFFFF_t_70_pic_center]: /images/20221120/a0a4f51ec2e844c4a140e6b7d012b05b.png

发表评论取消回复

表情：

评论列表（有 0 条评论，322人围观）

还没有评论，来说两句吧...

相关阅读

相关 Java类加载器原理：动态类加载实例

Java类加载器是Java运行时环境的一部分，负责将.class文件加载到JVM中。Java类加载机制遵循双亲委派模型，即当一个类加载器尝试加载一个类时，会先委托给其父类加载器

忘是亡心i/ 2024年11月07日 08:00/ 0 赞/ 61 阅读

相关 Java类加载器：动态加载类问题实例

在Java中，类加载器（ClassLoader）是负责将类（.class文件）加载到JVM中的组件。Java提供了几种不同的类加载器，包括启动类加载器（Bootstrap Cl

水深无声/ 2024年10月31日 22:48/ 0 赞/ 69 阅读

相关 Element-ui(Cascader 级联选择器)实现三级联动

1：将省市县数据三张表存放到数据库中市区表： CREATE TABLE `med_cities` ( `id` int(11) NOT NULL

Bertha 。/ 2023年10月04日 23:17/ 0 赞/ 91 阅读

相关 element级联选择器，异步加载回填问题

啊啊啊，记录一下我用的动态加载，但是一直回填不过去，我其实想到了因为异步所以一直没上去，但是一直想着找其他办法 ![在这里插入图片描述][watermark_ty

红太狼/ 2023年06月28日 09:56/ 0 赞/ 25 阅读

相关设置Cascader级联选择器默认值

// this.$set(this.teamArea,0,this.team.province) // this.$set(this.teamArea,1,th

谁借莪１个温暖的怀抱￠/ 2023年03月06日 03:51/ 0 赞/ 48 阅读

相关 element UI Cascader 级联选择器

<el-form-item label="跳转分类"> <el-cascader style="width: 300px;"

我就是我/ 2023年02月17日 02:57/ 0 赞/ 31 阅读

相关 Element UI学习3--Cascader 级联选择器

1、基础用法 1、默认 click 触发子菜单 <div class="block"> <span class="demonstration"

约定不等于承诺〃/ 2023年01月03日 04:16/ 0 赞/ 536 阅读

相关 vue+element cascader联选择器三级类目动态加载

当选中某一级时，动态加载该级下的选项。 html代码框里面只显示三级类目删除:show-all-levels=“false” 就会显示全部路径 <el-for

浅浅的花香味﹌/ 2022年12月25日 09:55/ 0 赞/ 323 阅读

相关 Element el-cascader 级联选择器详解

[点此查看全部文字教程、视频教程、源代码][Link 1] 本文目录 1. 概述 2. 数据绑定 2.1 默认数据绑定 2.2 指

女爷i/ 2022年09月09日 12:51/ 0 赞/ 826 阅读

相关 antd级联框Cascader动态加载的用法

一，官方文档：[https://ant.design/components/cascader-cn/\header][https_ant.design_components_c

朱雀/ 2022年04月15日 00:56/ 0 赞/ 1602 阅读