解决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 相关文章推荐
Ajax搜索结果页面下方的分页按钮的生成
Apr 05 Javascript
JavaScript中的Primitive对象封装介绍
Dec 31 Javascript
初识Node.js
Mar 20 Javascript
js 获取元素在页面上的偏移量的方法汇总
Apr 13 Javascript
JavaScript设置表单上传时文件个数的方法
Aug 11 Javascript
JavaScript禁止用户多次提交的两种方法
Jul 24 Javascript
jquery实现(textarea)placeholder自动换行
Dec 22 Javascript
移动端Ionic App 资讯上下循环滚动的实现代码(跑马灯效果)
Aug 29 Javascript
微信页面弹出键盘后iframe内容变空白的解决方案
Sep 20 Javascript
解决jquery的ajax调取后端数据成功却渲染失败的问题
Aug 08 jQuery
解决微信小程序scroll-view组件无横向滚动的问题
Feb 04 Javascript
在antd Form表单中select设置初始值操作
Nov 02 Javascript
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
PHPMailer邮件类利用smtp.163.com发送邮件方法
2008/09/11 PHP
php ios推送(代码)
2013/07/01 PHP
安装docker和docker-compose实例详解
2019/07/30 PHP
php异常处理捕获错误整理
2019/09/23 PHP
Laravel 解决419错误 -ajax请求错误的问题(CSRF验证)
2019/10/25 PHP
一实用的实现table排序的Javascript类库
2007/09/12 Javascript
JavaScript 判断指定字符串是否为有效数字
2010/05/11 Javascript
Javascript写入txt和读取txt文件示例
2014/02/12 Javascript
jquery实现勾选复选框触发事件给input赋值
2015/02/01 Javascript
js代码实现无缝滚动(文字和图片)
2015/08/20 Javascript
js获取浏览器和屏幕的各种宽度高度
2017/02/22 Javascript
详解angular element()方法使用
2017/04/08 Javascript
jQuery结合jQuery.cookie.js插件实现换肤功能示例
2017/10/14 jQuery
js判断数组是否包含某个字符串变量的实例
2017/11/24 Javascript
vue.js分页中单击页码更换页面内容的方法(配合spring springmvc)
2018/02/10 Javascript
微信小程序:数据存储、传值、取值详解
2019/05/07 Javascript
vant 时间选择器--开始时间和结束时间实例
2020/11/04 Javascript
python Django模板的使用方法(图文)
2013/11/04 Python
使用Python实现简单的服务器功能
2017/08/25 Python
基于python实现从尾到头打印链表
2019/11/02 Python
python GUI库图形界面开发之PyQt5菜单栏控件QMenuBar的详细使用方法与实例
2020/02/28 Python
Python sqlalchemy时间戳及密码管理实现代码详解
2020/08/01 Python
Python __slots__的使用方法
2020/11/15 Python
编程用JAVA解析XML的方式
2013/07/07 面试题
春季防火方案
2014/05/10 职场文书
企业诚信承诺书
2014/05/23 职场文书
学雷锋宣传标语
2014/06/25 职场文书
ktv好的活动方案
2014/08/15 职场文书
捐款感谢信
2015/01/20 职场文书
财务人员个人工作总结
2015/02/27 职场文书
学校国庆节活动总结
2015/03/23 职场文书
2015年度优秀员工推荐信
2015/03/23 职场文书
旅游项目合作意向书
2015/05/08 职场文书
单位综合评价意见
2015/06/05 职场文书
TV动画《史上最强大魔王转生为村民A》番宣CM公布
2022/04/01 日漫
Go语言入门exec的基本使用
2022/05/20 Golang