ionic里面有不少彩蛋——就是官網沒有說明,但是可以用的,因為一段時間沒用ionic做項目,所以一時想不起來,先列幾個:
一、眾所周知的
軟鍵盤出現搜索按鈕
form標簽包含ion-searchbar即可。
解決非交互組件的點擊延時
這類組件也是可以響應點擊事件的,只是因為要判斷是否有后續響應(如判斷是否雙擊),會有幾百ms的延時,這時加上tappable即可
關閉ios的webview下拉回彈
在config.xml添加配置:
<preference name="WebViewBounce" value="false" />
<preference name="UIWebViewBounce" value="false" />
<preference name="DisallowOverscroll" value="true" />
二、較為隱藏的
輸入框內容支持復制黏貼
ion-input包含在ion-item里面即可,而且如果不包,在ios可能還會出現問題。
組件使用某平臺樣式
一般我們在config里面的mode設置了平臺后,主題風格就會是該平臺,當我們某個組件想選用另一平臺的樣式時,它有mode屬性時很容易實現,當沒有的時候呢?其實,我們只要取現有樣式名,換掉后綴,并添加即可,如ios平臺ion-checkbox會生成checkbox-ios樣式,一般只需給該控件加上
checkbox-md
類名即可變成android風格,因為它一般會覆蓋原來的平臺的樣式(會存在風險,未必會百分百成功,慎用!!更合理的是移除原來平臺類名,再添加新平臺類名)。
<ion-checkbox class="checkbox-md"></ion-checkbox>
還有更“傷心病狂”的在ts中用:
const actionSheet = this.actionSheetCtrl.create({
title: '查詢結果',
cssClass: 'action-sheet-md'
});
主動觸發下拉刷新
要在渲染后,不然refresher可能為未定義。
@ViewChild(Refresher) refresher: Refresher;
ionViewDidLoad(){
this.refresher._beginRefresh();
}
input相關組件的隱藏事件
像ion-searchbar、ion-input、ion-textarea等,都是有ionBlur、ionFocus、ionChange三個事件的,只是官方文檔沒有寫……
textarea指定行數
使用官方的ion-textarea時,使用rows屬性指令,如:
<ion-textarea placeholder="說點什么吧" rows="6"></ion-textarea>
web版獲取外部請求傳遞參數
const url: string = window.location.search;
……
想到再補充,或者大家知道的,麻煩也說一下。