你知道如何改變ion-select上所選專案的顏色嗎?我在這里嘗試了很多方法,但都沒有成功。有什么線索嗎?
uj5u.com熱心網友回復:
檢查一下ion-select-option的檔案。
https://ionicframework.com/docs/api/select-option
/*
* "my-custom-interface "需要通過以下方式傳入
*介面選項的cssClass,這樣才能發揮作用
*/
.my-custom-interface .select-interface-option {
color: red;
}
/* popover界面:使用Item的CSS變數為popover設定顏色 */
.my-custom-interface .select-interface-option {
--color: #971e49。
--color-hover: #79193b;
}
uj5u.com熱心網友回復:
首先在你的.ts檔案中,你需要創建一個變數來保存interfaceOptions的資料,其中我添加了customPopoverOptions變數。
customPopoverOptions: any = {
cssClass: 'popover-wide',
};
在你的html檔案中,你需要添加interfaceOptions來從global.scss中匯入cssClass:
< ion-select mode="md"/span> [interfaceOptions]="customPopoverOptions" placeholder="Sort By" interface=" popover">
<ion-select-option value="1"> Newest</ion-select-option>
<ion-select-option value="2"> Oldest</ion-select-option>
<ion-select-option value="3"/span>> 在Me</ion-select-option>
</ion-select>。
在你的global.scss中添加下面的css。我們需要在global.scss中添加它的原因是ion-popover是在當前頁面之外附加的。在Angular中,一個特定頁面的CSS只對該頁面的元素有作用。
. popover-wide {
ion-radio {
--color-checked: red ! important;
}
}
我創建了一個stackblitz,以便你檢查我的實作。
轉載請註明出處,本文鏈接:https://www.uj5u.com/qukuanlian/318985.html
標籤:

