• vue需求表单有单位(时分秒千克等等)


    需求如下:

    问题分析:

    因为用elementui组件 el-input 相当于块级元素,后面的单位<span>分</span>会被挤下去,无法在同一水平。

    解决方法:

    不用它的组件,自己写个原生的,用组件的class名,替换el-input__inner 为 el-input__myinner

      <el-form-item label="处理耗时">
           <div class="el-form-item__content"></div>
           <input type="text" class='el-input__myinner' v-model="form.take_timeautocomplete='off'>
          <span></span>
     </el-form-item>

    在F12模式下,可以查看 el-input__inner   的样式,将样式复制下来,修改一下就可。

    .el-input__myinner{
                -webkit-appearancenone;
                background-color#FFF;
                background-imagenone;
                border-radius4px;
                border1px solid #DCDFE6;
                -webkit-box-sizingborder-box;
                box-sizingborder-box;
                color#606266;
                displayinline-block;
                font-sizeinherit;
                height40px;
                line-height40px;
                outline0;
                padding0 15px;
                -webkit-transitionborder-color .2s cubic-bezier(.645,.045,.355,1);
                transitionborder-color .2s cubic-bezier(.645,.045,.355,1);
                margin-right:10px;
              }
  • 相关阅读:
    Problem D: 双向冒泡排序
    Problem C: 查找最大元素
    Problem D: 小平查密码
    Problem C: 文件单词首字母大写
    Problem B: 文件操作文本文件读入
    Problem A: 文件操作二进制文件读入
    Problem A: 实现链表(线性表)
    【leetcode】包含min函数的栈
    【leetcode】反转链表
    【leetcode】合并两个排序的链表
  • 原文地址:https://www.cnblogs.com/duanhuarong/p/11934520.html
Copyright © 2020-2023  润新知