参见馆藏库房系统，

右侧整体结构一般如下

<el-container class="ml10 mr10 br7 bgw">

　　<el-main> // el-main默认就是100%的高度，主要包括三个区域

　　　　1、上面筛选区域,一般为35px+10px的margin值

　　　　<el-form>

　　　　</el-form>

　　　　2、下面表格区域，表格区域的高，就是等于100% - (筛选区域的高 +  翻页区域的高（含magin值）)

　　　　<div style= "height:calc(100% - 90px)">

　　　　<el-table height="100%">　　　//我们需要计算的就是table外层div的高，然后给table设置height="100%"即可，不需要减去表头的高度

　　　　</el-table>

　　　　</div>

　　　　3、翻页区域，一般为35px+10px的margin值

　　</el-main>

</el-container>

　　

vue项目前台带表格的页面，让表格根据屏幕大小自适应高度，小屏幕时不出现多个滚动条的更多相关文章

  1. 在vue项目中添加一个html页面，开启本地服务器

    在vue项目里新增一个不需要登录的页面,那么我只能新增一个html页面了,不经过路由,直接在浏览器输入路径打开,那么就需要用到本地服务器, 1.vue里面的html页面最好放过在public文件夹里面 ...

  2. 在vue项目中，解决如何在element表格中循环出图片列！

    效果图: 1,vue项目环境 2,引入element-ui组件 3,制作表格 此处省去制作循环表格数据那步,想看的可以找回我的博客:element中的表格处理:循环出表格数据 今天想在表格出循环出一列 ...

  3. vue项目中利用popstate处理页面返回操作

    需求背景:项目中需要做一个返回确认,避免用户误触返回键而退出当前页面. 原理:利用history和浏览器刷新popstate状态 实现: 1.在mounted() 阶段判断并添加popstate事件监 ...

  4. 如何机智判断页面是刷新还是关闭，背景：vue项目，需求：关闭页面，下次直接跳到登陆页

    最近项目有这么个需求:要在关闭当前系统的窗口的时候,退出登录, 因为如果不退出登录可能存在安全风险,其实我想说,电脑没事别借给别人活着离开工位记得一定要锁屏,其实我们设置了cookie失效时间的,过了 ...

  5. 在Vue项目中使用html2canvas生成页面截图并上传

    使用方法 项目中引入 npm install html2canvas html代码 //html代码 <!-- 把需要生成截图的元素放在一个元素容器里,设置一个ref --> <di ...

  6. Vue项目中设置每个单页面的标题

    两种实现方法,第一种方法引入插件,第二种为编程方式实现(推荐) 首先在路由文件index.js中给每个单页面路由添加title routes: [{     path: '/',     name: ...

  7. Vue项目之IE下打开页面是空白

    原因是:Babel 默认只转换新的 JavaScript 句法(syntax),而不转换新的 API ,比如 Iterator.Generator.Set.Maps.Proxy.Reflect.Sym ...

  8. vue 项目build后部署上去页面空白

    默认情况下vue-cli 会认为项目是部署在域名的根路径上. 但是当项目被部署到了一个子路径上,就要自己选定子路径. 比如项目被部署在了 https://www.ujapp.com/my-app, 则 ...

  9. vue 项目部署后 刷新一下 页面找不到 解决

    1.修改配置router的参数  (效果不好) 2. (不能解决 出现403) 后端配置例子 Apache <IfModule mod_rewrite.c> RewriteEngine O ...

  10. 简单vue项目脚手架（vue+webpack2.0+vuex+vue-router）

    github地址 使用技术栈 webpack(^2.6.1) webpack-dev-server(^2.4.5) vue(^2.3.3) vuex(^2.3.1) vue-router(^2.5.3 ...

随机推荐

  1. 2022-05-10内部群每日三题-清辉PMP

    1.项目经理管理的一个项目不断面临挑战.发起人经常无法做出决定,存在大量预算超支,团队成员不断从项目离职,高级管理层没有提供实际的支持.项目经理应该怎么做? A.与团队一起开会,以确定造成这些问题的原 ...

  2. 查看当前linux进程所在的目录

    1.通过 ps -ef | grep xxx 查看进程信息 ps -ef | grep rsi 1 2.通过 ll /proc/PID 命令查看进程所在目录位置 ls -l /proc/PID 1 L ...

  3. dll帮助类

    项目中有很多时候用到外部dll,调用的时候如果用静态调用,程序exe目录下有很多dll,看起来很乱,不利于后续维护:动态调用可以把dll放在想放的文件夹内,但是如果一个dll要用到的函数很多,动态调用 ...

  4. Java_用数组保存并显示杨辉三角

    import java.util.Scanner; public class Yang_Hui_Triangle { public static void main(String[] args) { ...

  5. Win10 U盘不自动显示

    Win+R,在窗口中输入 命令services.msc,然后点击确定按钮:这时就会打开Windows10的服务列表,在列表中找到Plug and Play服务项.双击后看一下该服务是否启动,先停止,然 ...

  6. vs MFC c++ rc文件的dilog打不开，显示加载失败

    最近在做一个项目,在vs2012上面用mfc画界面,由于没有确定好且不熟悉这个架构,控件类型变了又变,本人又是个有点强迫症的性格所以删掉了一些不用的控件,导致的结果就是上面说的,dialog打不开报加 ...

  7. 小程序微信支付完整demo，包含退款

    最近刚完成一个商场小程序(http://market.zhenzikj.com/detail/121.html), 使用到了微信支付功能,其中遇到了很多的抗,所以,我把支付这块摘出来,以免大家少走弯路 ...

  8. DDL数据定义--Hive中数据可和表的基本操作（增删改查）

    数据库 创建数据库: CREATE DATABASE [ IF NOT EXISTS ]  database_name *****IF NOT EXISTS进行判断,避免创建的数据库已经存在的错误 创 ...

  9. RocketMQ学习笔记

    RocketMQ学习笔记 RocketMQ学习参考官网文档:https://github.com/apache/rocketmq/tree/master/docs/cn . 由于RocketMQ是有国 ...

  10. 阿里云仓库构建gcr镜像

    经常用到gcr的镜像,但是由于国内无法访问,使用阿里云仓库构建 例如需要获取:gcr.io/spiffe-io/spire-server:1.0.1 镜像 1.使用阿里云code,创建项目,新项目 增 ...