解决ant-design-vue中menu菜单无法默认展开的问题


Posted in Javascript onOctober 31, 2020

在ant-design-vue的文档中,

解决ant-design-vue中menu菜单无法默认展开的问题

menu有两个可以传的参数,分别为defaultOpenKeys和openKeys,但在接手做一个项目时,openKeys这个参数前人已经写了,可能是从文档中直接复制demo没有删除掉,我也没去管。

等到需要用到这个defaultOpenKeys的时候,想做每次刷新还会再次打开上次打开的菜单的效果,但一直无效,网上也没有查到有类似的情况,后面只能自己去看源码,查了一下,发现这个代码片段

解决ant-design-vue中menu菜单无法默认展开的问题

这段代码不就说明了有openKeys就不会有defaultOpenKeys吗?

终于解开疑惑,可以继续愉快的敲代码了。

补充知识:ant design中table表格提交数据刷新问题

问题描述:在ant design 中table表格中添加一条新的记录,但是表格不刷新数据,第二次提交才刷新出第一条的数据。

解决方法:

在app.vue中写

provide(){
  return {
   reload: this.reload
  }

methods中:

reload() {
   this.isRouterAlive = false`在这里插入代码片`
   this.$nextTick(function () {
    this.isRouterAlive = true
   })
  }

解决ant-design-vue中menu菜单无法默认展开的问题

在你添加表格数据的页面中注入reload

解决ant-design-vue中menu菜单无法默认展开的问题

然后在添加数据的方法中引入this.reload() 即可

解决ant-design-vue中menu菜单无法默认展开的问题

这样做,因为reload有强制当前页面刷新的功能

如果不需要页面重新刷新一遍,我们可以把提交的数据当作data传给后端。

解决ant-design-vue中menu菜单无法默认展开的问题

这样表格提交后自动刷新。

以上这篇解决ant-design-vue中menu菜单无法默认展开的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 日历提醒系统( 兼容所有浏览器 )
Apr 07 Javascript
Jquery作者John Resig自己封装的javascript 常用函数
Nov 09 Javascript
关于this和self的使用说明
Aug 01 Javascript
Node.js中防止错误导致的进程阻塞的方法
Aug 11 Javascript
微信小程序侧边栏滑动特效(左右滑动)
Jan 23 Javascript
用node和express连接mysql实现登录注册的实现代码
Jul 05 Javascript
解决vue+webpack打包路径的问题
Mar 06 Javascript
create-react-app安装出错问题解决方法
Sep 04 Javascript
JS 实现获取验证码 倒计时功能
Oct 29 Javascript
vue router 跳转时打开新页面的示例方法
Jul 28 Javascript
node express使用HTML模板的方法示例
Aug 22 Javascript
vue修饰符.capture和.self的区别
Apr 22 Vue.js
Ant Design的可编辑Tree的实现操作
Oct 31 #Javascript
antd多选下拉框一行展示的实现方式
Oct 31 #Javascript
解决antd 下拉框 input [defaultValue] 的值的问题
Oct 31 #Javascript
Vue使用CDN引用项目组件,减少项目体积的步骤
Oct 30 #Javascript
vue+swiper实现左右滑动的测试题功能
Oct 30 #Javascript
利用vue3+ts实现管理后台(增删改查)
Oct 30 #Javascript
vue项目页面嵌入代码块vue-prism-editor的实现
Oct 30 #Javascript
You might like
php读取数据库信息的几种方法
2008/05/24 PHP
PHP取得一个类的属性和方法的实现代码
2011/05/22 PHP
关于PHP堆栈与列队的学习
2013/06/21 PHP
php 获取今日、昨日、上周、本月的起始时间戳和结束时间戳的方法
2013/09/28 PHP
CodeIgniter安全相关设置汇总
2014/07/03 PHP
PHP使用PDO连接ACCESS数据库
2015/03/05 PHP
PHP对象、模式与实践之高级特性分析
2016/12/08 PHP
php mysql_list_dbs()函数用法示例
2017/03/29 PHP
PHP SESSION跨页面传递失败解决方案
2020/12/11 PHP
javascript入门·图片对象(无刷新变换图片)\滚动图像
2007/10/01 Javascript
fancybox1.3.1 基于Jquery的插件在IE中图片显示问题
2010/10/01 Javascript
8个超棒的学习 jQuery 的网站 推荐收藏
2011/04/02 Javascript
JS获取select的value和text值的简单实例
2014/02/26 Javascript
js+css实现有立体感的按钮式文字竖排菜单效果
2015/09/01 Javascript
bootstrap常用组件之头部导航实现代码
2017/04/20 Javascript
ReactNative列表ListView的用法
2017/08/02 Javascript
微信小程序实现折叠展开效果
2018/07/19 Javascript
详解三种方式解决vue中v-html元素中标签样式
2018/11/22 Javascript
JS实现炫酷轮播图
2020/11/15 Javascript
Vue-router编程式导航的两种实现代码
2021/03/04 Vue.js
Python绘制七段数码管实例代码
2017/12/20 Python
Python面向对象基础入门之设置对象属性
2018/12/11 Python
numpy基础教程之np.linalg
2019/02/12 Python
彻底搞懂python 迭代器和生成器
2020/09/07 Python
美国指甲油品牌:Deco Miami
2017/01/30 全球购物
澳大利亚宠物商店:Petbarn
2017/11/18 全球购物
英国可持续奢侈品包包品牌:Elvis & Kresse
2018/08/05 全球购物
Farfetch阿联酋:奢侈品牌时尚购物平台
2019/07/26 全球购物
如何利用find命令查找文件
2016/11/18 面试题
电钳专业个人求职信
2014/01/04 职场文书
小学数学课题方案
2014/06/15 职场文书
2014小学教师年度考核工作总结
2014/12/03 职场文书
周恩来的四个昼夜观后感
2015/06/03 职场文书
Java基础——Map集合
2022/04/01 Java/Android
Python之Matplotlib绘制热力图和面积图
2022/04/13 Python
Go结合Gin导出Mysql数据到Excel表格
2022/08/05 Golang