el-upload 按钮与普通按钮一行显示（element-ui）

我先来一碗

于 2020-12-10 17:37:29 发布

阅读量5.2k

点赞数 7

CC 4.0 BY-SA版权

分类专栏：前端日常

本文链接：https://blog.youkuaiyun.com/jack_bob/article/details/110957754

前端日常专栏收录该内容

65 篇文章

订阅专栏

参考文章：https://blog.youkuaiyun.com/weixin_30698527/article/details/94971098?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-2.control&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-2.control

原型展示：

解决方式：添加：inline-block

代码：

                <el-upload
                    ref="upload"
                    :on-success="handleSuccess"
                    :on-error="handleError"
                    :before-upload="beforeUpload"
                    :auto-upload="true"
                    action="/api/xxxx/uploadExcel"
                    class="upload-demo inline-block">
                    <el-button size="mini" class="" type="primary" icon="el-icon-upload2" @click="doExcel()" style="margin-left: 10px; ">文档导入</el-button>
                </el-upload>

  /* 解决 上传下载按钮 不能再一行显示 */
  .inline-block {
  display: inline-block;
}

展示：