# page-container
基礎(chǔ)庫 2.16.0 開始支持,低版本需做兼容處理。
微信 Windows 版:支持
微信 Mac 版:支持
微信 鴻蒙 OS 版:支持
渲染框架支持情況:Skyline (使用最新 Nightly 工具調(diào)試)、WebView
# 功能描述
頁面容器。
小程序如果在頁面內(nèi)進行復雜的界面設(shè)計(如在頁面內(nèi)彈出半屏的彈窗、在頁面內(nèi)加載一個全屏的子頁面等),用戶進行返回操作會直接離開當前頁面,不符合用戶預期,預期應(yīng)為關(guān)閉當前彈出的組件。
為此提供“假頁”容器組件,效果類似于 popup 彈出層,頁面內(nèi)存在該容器時,當用戶進行返回操作,關(guān)閉該容器不關(guān)閉頁面。返回操作包括三種情形,右滑手勢、安卓物理返回鍵和調(diào)用 navigateBack 接口。
# 屬性說明
| 屬性 | 類型 | 默認值 | 必填 | 說明 | 最低版本 |
|---|---|---|---|---|---|
| show | boolean | false | 否 | 是否顯示容器組件 | 2.16.0 |
| duration | number | 300 | 否 | 動畫時長,單位毫秒 | 2.16.0 |
| z-index | number | 100 | 否 | z-index 層級 | 2.16.0 |
| overlay | boolean | true | 否 | 是否顯示遮罩層 | 2.16.0 |
| position | string | bottom | 否 | 彈出位置,可選值為 top bottom right center | 2.16.0 |
| round | boolean | false | 否 | 是否顯示圓角 | 2.16.0 |
| close-on-slide-down | boolean | false | 否 | 是否在下滑一段距離后關(guān)閉 | 2.16.0 |
| overlay-style | string | 否 | 自定義遮罩層樣式 | 2.16.0 | |
| custom-style | string | 否 | 自定義彈出層樣式 | 2.16.0 | |
| bind:beforeenter | eventhandle | 否 | 進入前觸發(fā) | 2.16.0 | |
| bind:enter | eventhandle | 否 | 進入中觸發(fā) | 2.16.0 | |
| bind:afterenter | eventhandle | 否 | 進入后觸發(fā) | 2.16.0 | |
| bind:beforeleave | eventhandle | 否 | 離開前觸發(fā) | 2.16.0 | |
| bind:leave | eventhandle | 否 | 離開中觸發(fā) | 2.16.0 | |
| bind:afterleave | eventhandle | 否 | 離開后觸發(fā) | 2.16.0 | |
| bind:clickoverlay | eventhandle | 否 | 點擊遮罩層時觸發(fā) | 2.16.0 |
# Bug & Tip
tip: 當前頁面最多只有1個容器,若已存在容器的情況下,無法增加新的容器tip:wx.navigateBack無法在頁面棧頂調(diào)用,此時沒有上一級頁面tip: 鴻蒙 OS 下暫時無法攔截頁面返回