解决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 相关文章推荐
js function使用心得
May 10 Javascript
js将控件隐藏及display属性的使用介绍
Dec 30 Javascript
JS控制网页动态生成任意行列数表格的方法
Mar 09 Javascript
Jquery全选与反选点击执行一次的解决方案
Aug 14 Javascript
jQuery实现的导航下拉菜单效果示例
Sep 05 Javascript
Vue.js 父子组件通讯开发实例
Sep 06 Javascript
解析Vue2.0双向绑定实现原理
Feb 23 Javascript
JS排序之选择排序详解
Apr 08 Javascript
用 js 的 selection range 操作选择区域内容和图片
Apr 18 Javascript
微信小程序实现聊天对话(文本、图片)功能
Jul 06 Javascript
Vue axios全局拦截 get请求、post请求、配置请求的实例代码
Nov 28 Javascript
idea编译器vue缩进报错问题场景分析
Jul 04 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/09/10 PHP
创建配置文件 用PHP写出自己的BLOG系统 2
2010/04/12 PHP
PHP压缩html网页代码(清除空格,换行符,制表符,注释标记)
2012/04/02 PHP
PHP 生成N个不重复的随机数
2015/01/21 PHP
javascript YUI 读码日记之 YAHOO.util.Dom - Part.4
2008/03/22 Javascript
ASP.NET jQuery 实例13 原创jQuery文本框字符限制插件-TextArea Counter
2012/02/03 Javascript
基于jQuery实现模拟页面加载进度条
2013/04/01 Javascript
javascript生成随机数的方法
2014/05/16 Javascript
javascript浏览器窗口之间传递数据的方法
2015/01/20 Javascript
js实现键盘Enter键提交表单的方法
2015/05/27 Javascript
vue实现可增删查改的成绩单
2016/10/27 Javascript
BootStrap 实现各种样式的进度条效果
2016/12/07 Javascript
jQuery实现拖动剪裁图片作为头像
2016/12/28 Javascript
JavaScript拖动层Div代码
2017/03/01 Javascript
Vue组件选项props实例详解
2017/08/18 Javascript
在HTML文档中嵌入JavaScript的四种方法
2018/05/07 Javascript
基于js Canvas实现二次贝塞尔曲线
2018/12/25 Javascript
微信小程序文章详情页跳转案例详解
2019/07/09 Javascript
小程序的上传文件接口的注意要点解析
2019/09/17 Javascript
vue-froala-wysiwyg 富文本编辑器功能
2019/09/19 Javascript
[47:42]Fnatic vs Liquid 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
python怎么提高计算速度
2020/06/11 Python
使用CSS3的背景渐变Text Gradient 创建文字颜色渐变
2014/08/19 HTML / CSS
英国蜡烛、蜡烛配件和家居香氛购买网站:Yankee Candle
2018/12/12 全球购物
Overload和Override的区别
2012/09/02 面试题
JAVA中运算符的分类及举例
2015/09/12 面试题
广告创意求职信
2014/03/17 职场文书
幼儿教师求职信
2014/05/24 职场文书
学习优秀党员杨宗兴先进事迹材料思想汇报
2014/09/14 职场文书
工伤事故处理协议书怎么写
2014/10/15 职场文书
开展批评与自我批评发言材料
2014/10/17 职场文书
2015年学校管理工作总结
2015/07/20 职场文书
文明礼貌主题班会
2015/08/14 职场文书
银行岗位培训心得体会
2016/01/09 职场文书
Python基础详解之邮件处理
2021/04/28 Python
pytorch--之halfTensor的使用详解
2021/05/24 Python