我正在使用分屏窗格组件,并希望根据我的要求更改左侧面板的最小宽度和最大宽度。
为此,我正在从variables.scss
文件中的离子文档更改SplitPane提供的sass变量。
但在进行离子服务后,更改未反映在main.css
文件中。
首先我认为这可能是sass的问题,但是我更改了另一个名为@background-color
的变量并且它有效。
请有人帮忙吗?
这是离子信息
@ionic/cli-utils : 1.19.2
ionic (Ionic CLI) : 3.20.0
local packages:
@ionic/app-scripts : 1.1.4
Ionic Framework : ionic-angular 2.2.0
System:
Node : v6.11.1
npm : 3.10.10
OS : Windows 10
Misc:
backend : legacy
感谢。
答案 0 :(得分:0)
根据文档here
默认情况下,当屏幕大于768px时,SplitPane将展开。如果要自定义此选项,请使用when输入。 when输入可以接受任何有效的媒体查询,因为它在下面使用matchMedia()。
<ion-split-pane when="(min-width: 475px)">
<!-- our side menu -->
<ion-menu [content]="content">
....
</ion-menu>
<!-- the main content -->
<ion-nav [root]="root" main #content></ion-nav>
</ion-split-pane>
您也可以在代码中对其进行自定义
<ion-split-pane [when]="shouldShow()">
...
</ion-split-pane>
class MyClass {
constructor(){}
shouldShow(){
if(conditionA){
return true
} else {
return false
}
}
}