关于jeecgboot中前端Ant Design Vue 建一个全屏的页面怎么弄

打工人android小白

已于 2022-12-16 10:33:26 修改

阅读量1.5k

点赞数

分类专栏：学习日记文章标签： vue.js 前端 javascript

于 2022-12-02 11:48:15 首次发布

本文链接： https://blog.csdn.net/weixin_47062100/article/details/128145303

版权

学习日记专栏收录该内容

6 篇文章 0 订阅

订阅专栏

关于Ant Design Vue 第一次接触pc前端建一个全屏的页面怎么弄都不知道，废话不多说；看代码，在views下面新建需要的页面
在这里插入图片描述
1.点击项目中的路由进入index.js页面，点击constantRouterMap，进入router.config.js
2.复制这个{}下面的类容

3.粘贴在下面把不需要的删除掉，路径记得是你新建的views下面的那个路径，还得注意的是看下面

4.根据上面的userLayout，点进去复制一个自己创建新建一个listLayout，把不要的全部删除干净
在这里插入图片描述

记得禁掉不要的div样式（这些样式都是登录页面的样式，所以不要了）

继续看

在celllist页面中返回，这几个返回都可以至于区别自己搜索，不用在前端去添加路径直接就可以跳转到这个页面（如有不足请指正，一起加油）
在这里插入图片描述

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

打工人android小白

关注关注

0
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录

基于antdesign的vuejsloading组件

08-12

标题"基于antdesign的vuejs loading组件"指的是将Ant Design Vue的loading组件应用到Vue.js项目中。这涉及到的知识点主要包括以下几个方面： 1. **Vue.js基础知识**：理解Vue.js的核心概念，如Vue实例、组件、指令...

jeecg的Vue前端加全屏页面，并在新的窗口打开

weixin_40992252的博客

11-10

1758

jeecg的Vue前端加全屏页面，并在新的窗口打开

参与评论您还未登录，请先登录后发表或查看评论

Ant-Design-Pro-V5：实现页面全屏。

~~~

06-09

1181

Ant-Design-Pro-V5：实现页面全屏。

基于jeecgboot的大屏设计器开发——大屏报表管理（二）

宁波阿成的博客

04-03

1010

基于jeecgboot的大屏设计器开发——大屏报表管理（二）

vue项目全屏功能及局部全屏下使用ant-design-vue中弹框类组件不展示

weixin_43840320的博客

08-18

2061

全屏下ant组件被覆盖

大屏antdesign走马灯轮播加图形渲染

技术不够，加班来凑

03-24

1999

项目是vue+antdesign，要做大屏，实现的效果是轮播切换，每五条一组，分别有柱状图和饼状图首先父组件布局图标类的为子组件父组件的大概数据格式为本来是多条数据，分成每五条一组子组件内渲染数据一开始使用getElementByClassName 会导致轮播和双重循环出现问题，数据对应不上，方法错误，直接用一层ref搞定 ...

antd 模态框Modal实现ant-modal-body内容全屏

体验新模板

04-04

1288

【代码】antd 模态框Modal实现ant-modal-body内容全屏。

在vue中实现某一些路由页面隐藏导航栏的功能操作

10-14

一种方法是创建一个名为`redirect.vue`的空白页面，然后在`beforeCreate`钩子中根据查询参数重定向回目标页面： ```javascript export default { beforeCreate() { const nextPath = this.$route.query.nextPath...

vue中获取滚动table的可视页面宽度调整表头与列对齐(每列宽度不都相同)

10-16

在Vue.js应用中，开发一个具有滚动功能的表格并保持表头与列对齐是一项常见的需求。当表格列的宽度不同时，这个问题变得更加复杂。本文将详细介绍如何在Vue中实现这个功能，主要涉及以下几个关键点： 1. **监听滚动...

vue实现整屏滚动切换

12-28

本文实例为大家分享了vue实现整屏滚动切换的具体代码，供大家参考，具体内容如下 1、下载vue-awesome-swiper ...3、直接上案例，新建一个路由页面 <swiper id=swiperBox v-bind:options=swiperOption ref=my

Layui-admin:一个现成的Layui + Vue的后台系统模板，开箱即用

03-11

但是很多时候你想要的大概一个现成的页面模板，一个能Swift帮你完成开发的框架而已，Layui-admin就是这样一个接近完成的后台系统模板，它已经帮你完成了从登录验证，记住密码，权限管理，临时校准，搜索查询，联动...

vue二次封装ant-design-vue中的Modal弹窗组件，实现拖拽，全屏两种功能，原有参数属性不变

热门推荐

草率小猿的博客

05-30

1万+

接触React + Ant Design开发也有一段时间了，也已经慢慢习惯了React + Ant Design。最近开发的需求功能里，需要一个全屏弹窗的功能，类似于ElementUI里的Dialog组件fullscreen属性设置为true的效果。然后发现Ant Design的Modal组件并不支持全屏效果。

antd+全屏的坑(全屏下a-modal/下拉框等不展示)

weixin_58031521的博客

10-30

1613

方案一：改变挂载对象。挂到根节点上：document.documentElement，再使用定位fixed目标元素，改变z-index。（全屏的还是根节点，全屏时给跟节点加class，再进行fixed)。方案二：全屏的时候给顶级元素加上一个class，写一份存在这个class下的样式去display:none需要隐藏的元素，关闭全屏时去掉这个class即可。原因：position:fixed进行相对于视口（viewport）的定位，且元素的位置在屏幕滚动时不会改变。（这个方式比较简单粗暴）

【AntDesign】解决antdesign控件在div全屏下不显示的问题

踩坑日常和学习笔记

12-23

4206

最近项目中有一个页面需要做全屏效果，但是发现全屏后antdesign的组件弹出层不展示（其实是有的，只是被全屏效果覆盖了）全屏效果实现可以参考：我的文章-【VUE】vue实现div全屏效果解决方法通过阅读AntDesign的官方文档得知有弹出层的组件都有一个名为 getPopupContainer 的属性即浮层渲染父节点，默认是渲染到 body 上 Tooltip、Popconfirm、Popover 、Select等组件都有该属性那么我们只需要将这个属性指定到我们全屏的Div上即可： 1、重点

AntdesignVue 针对局部全屏不显示问题来全局配置消息类Modal组件

朝花夕拾的博客

04-26

725

通过Vue.extend创建构造器子类暴露构造函数。首先封装Modal弹窗组件。main.js中全局配置。

AntdesignVue 局部全屏后Message、Select 、Modal、Date等组件不显示问题解决方案（最终版）

朝花夕拾的博客

04-25

4655

1、对this.$message.....这种的消息提示组件解决方案如下1、对this.$message.....这种的消息提示组件解决方案如下在main.js中全局配置消息提示测试可以在父组件DIV全屏后可以弹出提示。

Vue3 + Ant Design Vue Modal 对话框拖拽+缩放指令

weixin_50651687的博客

11-18

4123

Vue3 + Ant Design Vue Modal 对话框可拖拽+缩放指令

vue项目全屏状态下,ant-design中的a-model弹窗组件不显示

qq_25972233的博客

03-16

3809

最近遇到一个项目需求就是在一个组件里面进入全屏状态下,这个组件里面有一个a-model弹窗组件,不起作用的一个场景,a-model 被覆盖在浏览器全屏状态下面。

jeecgboot 引入 Ant Design vue 组件

05-26

要在 jeecgboot 中引入 Ant Design Vue 组件，你可以按照以下步骤进行操作： 1. 安装 Ant Design Vue 使用 npm 安装 Ant Design Vue： ``` npm install ant-design-vue --save ``` 2. 引入 Ant Design Vue 在 ...