Element UI:级联选择器Cascader_动态加载_多级请求不同接口(已知第一级调取第二级)
ELEMENT UI_CASCADER
使用过饿了么级联动态加载的小伙伴应该都知道,lazyLoad本身是一个无差别返回渲染结点的函数。
当我们存在一个需求:已知级联选择器的第一级结点,现在需要通过第一个结点的value入参调取第二级菜单。
将第一级结点的data写入options,将含有lazyLoad函数的data写入props,发现lazyLoad由于第一级结点由于不存在value而打印报错,点击后则能正常渲染二级选项。
将Axios置换为setTimeout无差别返回,会发现一级options也返回了lazyLoad中的结点,因此想要解决这个问题还要从lazyLoad根本解决。
LAZYLOAD
首先探究这个函数的执行机制,当页面渲染级联选择器时,lazyLoad被执行,抛出的参数从空对象注入数据为:
可以将其理解为初始化的一个过程,在选择一级菜单的一个options后再次打印node:
于是我们可以通过node.level判断当前活动node是第几级菜单,从而给出不同的resolve处理
或者通过node.data来判断是否为初始化,通过children判断它是否存在下级菜单。
这段代码简单实现了上一节提到的需求,这方面的可扩展性还是很好的。
- END -
Element UI:级联选择器Cascader_动态加载_多级请求不同接口(已知第一级调取第二级)的更多相关文章
- Unity 5.x动态加载光照信息(所有坑已踩)
能搜到这的应该是被新的烘焙系统坑了少时间,4.x到5.x美术必须重新烘焙,关于美术的没什么说的,只有---重新烘焙! 新的烘焙系统,为了兼容5.x的多场景编辑功能,将烘焙信息从mesh全部挪到了一个中 ...
- 4_爬NMPA药监总局_动态加载_传ID
http://scxk.nmpa.gov.cn:81/xk/ import requests url = 'http://scxk.nmpa.gov.cn:81/xk/itownet/portalAc ...
- 两种动态加载JavaScript文件的方法
两种动态加载JavaScript文件的方法 第一种便是利用ajax方式,第二种是,动静创建一个script标签,配置其src属性,经过把script标签拔出到页面head来加载js,感乐趣的网友可以看 ...
- 动态库DLL加载方式-静态加载和动态加载
静态加载: 如果你有a.dll和a.lib,两个文件都有的话可以用静态加载的方式: message函数的声明你应该知道吧,把它的声明和下面的语句写到一个头文件中 #pragma comment(lib ...
- java中的动态加载和热替换
https://blog.csdn.net/u010833547/article/details/54312052 ****************************************** ...
- [转]动态加载javascript
动态加载script到页面大约有俩方法 第一种就是利用ajax方式,把script文件代码从后台加载到前台,然后对加载到的内容通过eval()执行代码. 第二种是,动态创建一个script标签,设置其 ...
- (一)JQuery动态加载js的三种方法
Jquery动态加载js的三种方法如下: 第一种: $.getscript("test.js"); 例如: <script type="text/javascrip ...
- Vue + Element UI 实现权限管理系统 前端篇(十):动态加载菜单
动态加载菜单 之前我们的导航树都是写死在页面里的,而实际应用中是需要从后台服务器获取菜单数据之后动态生成的. 我们在这里就用上一篇准备好的数据格式Mock出模拟数据,然后动态生成我们的导航菜单. 接口 ...
- Vue + Element UI 实现权限管理系统(动态加载菜单)
动态加载菜单 之前我们的导航树都是写死在页面里的,而实际应用中是需要从后台服务器获取菜单数据之后动态生成的. 我们在这里就用上一篇准备好的数据格式Mock出模拟数据,然后动态生成我们的导航菜单. 接口 ...
随机推荐
- RHCSA_DAY12
Linux软件包的分类 inghu 源码包 二进制包(RPM包) 源码包特点 源码包缺点:安装过程麻烦,需要用户手动编译,需要手动解决软件包的依赖关系 源码包优点:软件源代码开放,允许用户二次开发,安 ...
- 内置函数 字符串的复制 strcpy
1 #include<stdio.h> 2 #include<stdlib.h> 3 #include<string.h> 4 5 6 void main() 7 ...
- webservice接口调用
package com.montnets.emp.sysuser.biz; import org.apache.axis.client.Call; import org.apache.axis.cli ...
- Linux进程理解与实践(一)基本概念和编程概述(fork,vfork,cow)
进程 and 程序 什么是程序? 程序是完成特定任务的一系列指令集合. 什么是进程? [1]从用户的角度来看:进程是程序的一次执行过程 [2]从操作系统的核心来看:进程是操作系统分配的内存.CPU时间 ...
- Linux引导过程和服务过程
目录 一.Linux操作系统引导过程 1.1.开机自检 1.2.MBR引导 1.3.GRUB菜单 1.4.加载Linux内核 1.5.init进程初始化 二.系统初始化进程 2.1.init进程 2. ...
- Linux 内核预备知识:浅析 offsetof 宏以及新手的所思所想
最近一头扎进了 Linux 内核的学习中,对于我这样一个没什么 C 语言基础的新生代 Java 农民工来说实在太痛苦了.Linux 内核的学习,需要的基础知识太多太多了:C 语言.汇编语言.数据结构与 ...
- NOIP 模拟 $31\; \rm Game$
题解 很容易求出在没有字典序最大的限制条件下的最多胜利场数. 这样就可以对于每一位放最优的解,怎么做,二分答案. 分两种情况,一种是当前一位是输的,一种是赢的,复杂度 \(\mathcal O(\rm ...
- DI 原理解析 并实现一个简易版 DI 容器
本文基于自身理解进行输出,目的在于交流学习,如有不对,还望各位看官指出. DI DI-Dependency Injection,即"依赖注入":对象之间依赖关系由容器在运行期决定, ...
- C#异步编程2
- NameNode&Secondary NameNode 工作机制
NameNode&Secondary NameNode 工作机制 NameNode: 1.启动时,加载编辑日志和镜像文件到内存 2.当客户端对元数据进行增删改,请求NameNode 3.Nam ...