Javascript 如何显示与高度和宽度输入相等的文件名

我使用bootstrap4，我的问题是当我放入一个长名称的文件时，该名称将从输入中消失

---

如果您可以提供一个代码示例，那就更好了，但实际上您需要在

输入上设置大小-
高度和
宽度，并在其上使用
溢出：隐藏

编辑：由于您使用的是Bootstrap 4及其输入文件实现，因此假设您的HTML与示例中提供的一样：

<div class="input-group mb-3">
  <div class="custom-file">
    <input type="file" class="custom-file-input" id="inputGroupFile01">
    <label class="custom-file-label" for="inputGroupFile01">Choose file</label>
  </div>
</div>

在这里拉小提琴：

如果您需要一个更优雅的解决方案，我建议在标签上使用溢出省略号和额外的填充，因此，当标签空间不足时，它将只在文件名末尾附加省略号，而不是剪切中间文本

.custom-file-label {
  white-space: nowrap; 
  overflow: hidden;
  text-overflow: ellipsis;
  padding-right:75px;
}

在这里拉小提琴：

将来，如果您使用代码示例和/或工作提琴更新您的问题，而不仅仅是提供您正在使用的框架的详细信息，您将更快、更准确地获得帮助。
减少名称的长度，如

fileName=fileName.substring(0, 10);

请阅读并编辑问题，并显示您尝试的代码。。
fileName=fileName.substring(0, 10);