zoukankan      html  css  js  c++  java
  • iview中upload的使用,Table表格的滚动获取

    一、upload的使用
             <Upload 
                :action="importParameterExcel"
                :format="['xlsx','xls','XLS','XLSX']"
                ref="upload"   
                name="excelFile"  //请求接口的参数的名字
                :headers="uploadHeaders"
                :before-upload="handleBeforeUpload"
                :on-format-error="handleFormatError"
                :on-success="handleSuccess"
                :on-error="handleError"
              >
                <Button type="primary" style=" margin: 0 14px;" >导入台账</Button>
              </Upload>
    
    importParameterExcel:process.env.VUE_APP_API_URL?process.env.VUE_APP_API_URL+'/dt-business/parameter/importParameterExcel':configs.baseURL.target+'/dt-business/parameter/importParameterExcel',
    uploadHeaders: {
      'token':tool.getStorage("X-Token"),
       'appId':tool.getStorage("appId")            
    },
     
    :before-upload="handleBeforeUpload"  //上传前
    :on-format-error="handleFormatError" //格式验证错误
    :on-success="handleSuccess"  //上传成功
    :on-error="handleError" //上传失败
     

    name 的值:

    二、表格的滚动的距离的获取

    <Table ref="TableHeight" :columns="columns" :data="data1"></Table>
    this.$refs.TableHeight.$refs.body.scrollTop

     三、关于使用iview table 组件中使用 tooltip 样式覆盖的问题

    加上 上述这个属性 设为true 会解决这个问题 设为true 之后 会置于body 内,
    更难受的问题来了,跳转页面之后 tooltip 的提示 还存在跳转之后的页面(为什么没有消失 可能就是因为 根据body 定位之后 dom留在了 body 中吧 : 基础不扎实。我也只是猜想,)
    我就想给定位 加上 z-index 增加权重 发现也还是不行,
    后面就在dom 上尝试 发现在 ivu-table-fixed-body(原生组件的class名) 这个class 样式中的 position:relative 改为 postion: initial 保持最初的定位。
    就解决了这一问题。initial 这个属性 感觉 还是很有用的 官方解释 设置 CSS 属性为它的默认值 所有的css 都有这个属性 大家可以官网上 看一下

     
  • 相关阅读:
    2016奇虎360研发工程师内推笔试编程题:找镇长
    2016奇虎360研发工程师内推笔试编程题:找到字符串第一个只出现一次的字符
    lintcode: 最长无重复字符的子串
    lintcode :同构字符串
    lintcode : 跳跃游戏
    lintcode :单词搜索
    Project Euler 110:Diophantine reciprocals II 丢番图倒数II
    Project Euler 109 :Darts 飞镖
    Project Euler 108:Diophantine reciprocals I 丢番图倒数I
    Project Euler 107:Minimal network 最小网络
  • 原文地址:https://www.cnblogs.com/zjz666/p/14685282.html
Copyright © 2011-2022 走看看