Ionic 修改离子日期时间按钮css属性

xfyts7mz  于 2023-09-28  发布在  Ionic
关注(0)|答案(1)|浏览(139)

我想将日期时间按钮的按钮文本转换属性更改为无。现在我的按钮看起来像这样:Buttons1
根据Ionic文档,我无法通过CSS shadow parts访问button-properties:https://ionicframework.com/docs/api/datetime#css-shadow-parts。
但是根据ion-button文档,按钮可以通过native属性访问:https://ionicframework.com/docs/api/button#css-shadow-parts
所以我在这里尝试访问离子日期时间模式中的按钮:

.export-ion-modal {
&::part(backdrop) {
    --backdrop-opacity: 0.3;
}
&::part(content) {
    background: var(--ion-color-primary-contrast);
    border-radius: 26px;
    box-shadow: 0px 0px 20px 5px rgb(0 0 0 / 32%);
}
&::part(native){
        text-transform: none;
}
}

不幸的是,这并没有起作用。是否有可能以某种方式访问离子日期时间的按钮属性?

tp5buhyn

tp5buhyn1#

你可以做到这一点,我的Js:

const buttons = document.querySelectorAll('ion-datetime ion-button');
buttons.forEach((button) => {
  button.style.textTransform = 'none';
});

相关问题