使用elmentUI里面el-button按钮替换input type=“file“ 默认按钮

最新推荐文章于 2024-04-23 09:18:13 发布

前端小蔡姬

最新推荐文章于 2024-04-23 09:18:13 发布

阅读量928

点赞数

文章标签： elementui vue.js javascript 前端 html

本文链接：https://blog.csdn.net/x_nweBorder01k/article/details/124715048

版权

先隐藏input的默认按钮，再把el-button的点击事件指向input的点击事件

 <form name="formInput">
        <input type="file" 
               id="fileDemo"
               class="input" 
               style="position:absolute; clip:rect(0 0 0 0);"   //隐藏样式
               @change="changeFileDemo">
 </form>
 <el-button size="small" 
            type="primary" 
            plain 
            onclick="document.formInput.fileDemo.click()">选择文件  //点击事件指向input
 </el-button>

formInput 为<form>里面name的值

fileDemo为<input>里面id的值