如何用reactjs改变文件输入的默认文本？

Posted 2021-04-28

我的jsx上有一个输入文件，我想改变 "Choisir un fichier "和 "Aucun fichier choisi "的文字。

我的代码是:

<div className="form-group">
    <label className="control-label col-sm-2" ><strong>Site - Logo (150 x 30px)</strong></label>
    <div className="col-sm-10">
        <input type="file" className="form-control-file" onChange={this.handleImgLogoChange} style={{border:'.1rem solid #d9d9d9', borderRadius:'.2rem'}}/>
    </div>
</div>

当我运行它时，我得到

如何改变输入文件的默认文本？

答案

        <div style={{width: 80, height: 80, border: '1px solid red', position: 'relative'}}>
          <label for='file' style={{position: 'absolute', width: 80, height: 80, cursor: 'pointer'}}>select file</label>
          <input id='file' type='file' onChange={this.handleFileUpload} style={{opacity: 0}} />
        </div> 

也许像这样？

你可以查看在线演示 Stackblitz演示