删除“或删除文件” Lightning Web 组件中文件上传按钮的部分/部分
您好，有什么方法可以从闪电文件上传按钮中删除这个“或删除文件”部分吗？ 在下面的屏幕截图中，我想删除“或删除文件”部分，只保留按钮和功能...... 这可能吗？
尝试使用此：
.html代码：
/* <div class="slds-m-around_medium">
<lightning-input type="file" accept=".xlsx, .xls, .csv, .png, .doc, .docx, .pdf"
onchange={openfileUpload}>
</lightning-input>
在css文件中：
.THIS .slds-file-selec`enter code here`tor__dropzone .slds-file-selector__text{
display: none !important;
}
但没有成功。 有什么解决方法吗？
Hi is there any way of removing this "or drop files" part from the lightning file upload button ?
In the below screen shot i want to remove the "or drop file" section and only keep the button and functionality as such...
is this possible ?
tried Using this:
.html code:
/* <div class="slds-m-around_medium">
<lightning-input type="file" accept=".xlsx, .xls, .csv, .png, .doc, .docx, .pdf"
onchange={openfileUpload}>
</lightning-input>
in css file:
.THIS .slds-file-selec`enter code here`tor__dropzone .slds-file-selector__text{
display: none !important;
}
but didn't worked.
is there any workaround ?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
由于 LWC Shadow DOM<，您无法执行此操作/a> 确保 CSS 和元素隔离。
您只能修改组件中定义的内容。
由于具有
slds-file-selector__text类的元素是在lightning-input组件内定义的，因此您无权访问，也无法覆盖其样式。您可以从蓝图。
标准 LWC 可以使用
var()< 设置 CSS 属性/code> 函数，它有两个参数：自定义标识符和可选的后备值。在这种情况下，您可以通过 样式挂钩 覆盖 LWC CSS 属性。
IE
闪电的
background-color-badge 定义如下：因此，您可以更改其背景，创建一个自定义 css 类，该类为令牌设置值
--sds-c-badge-color-background这是演示
遗憾的是
lightning-input不使用 var() 函数。You can't do that due to LWC Shadow DOM which ensures both CSS and Element isolation.
You're allowed to modify only what is defined in your component.
Since the element with
slds-file-selector__textclass is defined inside thelightning-inputcomponent you have no access and you cannot override its style.You could create your own component without the "or drop file" part starting from the blueprint.
A standard LWC could set a CSS property using
var()function, which takes two arguments: a custom identifier and an optional fallback value.In such cases you can override LWC CSS property via Styling Hooks.
I.E.
The
background-colorof a lightning-badge is defined as follow:Therefore you can change its background creating a custom css class that sets a value for the token
--sds-c-badge-color-backgroundHere's a demo
Sadly
lightning-inputdoesn't use var() function.