遇到的问题:

<el-form ref="formInline"  :model="formInline" label-position="right" >
   <el-row>
       <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" >
         <el-form-item label="标签" label-width="70" prop="ordernum" style="width: 100%">
           <el-input v-model="formInline.ordernum"  size="small" style="width: 100%"/>
         </el-form-item>
        </el-col>
    </el-row>
 </el-form>

这里如果不用 el-row 和 el-col ,不加样式 style="width: 100%" 的话好像是没有什么问题的(我的猜测我也不是很清楚,解决方法就是下面的)

加上之后应该 input 框就会掉下来,原因是 label-width="70px" 这里要加 px 否则就会出现现在的问题

正确代码如下:

<el-form ref="formInline" label-width="120px" :model="formInline" label-position="right" >
  <el-row>
   <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="6" >
     <el-form-item label="标签" label-width="70px" prop="ordernum" style="width: 100%">
        <el-input v-model="formInline.ordernum"  size="small" style="width: 100%"/>
      </el-form-item>
     </el-col>
  </el-row>
</el-form>

Logo

技术共进,成长同行——讯飞AI开发者社区

更多推荐