# 頁面返回手勢(shì)

默認(rèn)情況下，小程序頁面都是右滑返回。但在使用自定義路由和預(yù)設(shè)路由時(shí)，我們常常需要不同的手勢(shì)返回效果。

例如使用 wx://cupertino-modal 路由效果時(shí)，下個(gè)頁面自底向上出現(xiàn)，右滑返回并不符合視覺一致性。采用縱向的滑動(dòng)返回（原路返回）會(huì)更合適一些。

# 使用方法

開發(fā)者工具需升級(jí)到 Nightly 1.06.2403222，基礎(chǔ)庫選擇 3.4.0。

# 一行代碼配置

在自定義路由配置中，開發(fā)者可通過 fullscreenDrag 和 popGestureDirection 來定義手勢(shì)返回效果。

popGestureDirection 支持的枚舉值如下

• horizontal：僅能橫向拖動(dòng)返回，fullscreenDrag 僅對(duì)橫向拖動(dòng)有效
• vertical: 僅能縱向拖動(dòng)返回
• multi: 可以橫向或縱向拖動(dòng)返回

# 結(jié)合縱向滾動(dòng)容器

當(dāng)縱向拖動(dòng)返回時(shí)，若頁面內(nèi)有縱向滾動(dòng)的 <scroll-view>，默認(rèn)在 scroll-view 上滑動(dòng)無法觸發(fā)頁面返回。

此時(shí)可聲明關(guān)聯(lián)容器為 pop-gesture，此時(shí)滑動(dòng) scroll-view 至頂端后可繼續(xù)觸發(fā)頁面返回。

<scroll-view 
  type="custom"
  associative-container="pop-gesture"
>
  <!-- 頁面內(nèi)容 -->
</scroll-view>

# 結(jié)合預(yù)設(shè)路由

為增加路由配置的靈活性，3.4.0 版本起 wx.navigateTo 增加 routeConfig 和 routeOptions 兩個(gè)屬性。

# routeConfig

routeConfig 可配字段。navigateTo 傳入的 routeConfig 將會(huì)覆蓋 routeBuilder 返回的配置項(xiàng)，開發(fā)者可借此更改 預(yù)設(shè)路由 返回手勢(shì)類型。

# routeOptions

routeBuilder 接口定義。routeOptions 將作為 routeBuilder 的第二個(gè)參數(shù)傳入，開發(fā)者可根據(jù)當(dāng)前頁面動(dòng)態(tài)改變路由動(dòng)畫的內(nèi)容。比如對(duì) BottomSheet 更改高度、圓角等，以適應(yīng)不同場(chǎng)景。

interface INavigateToArg {
  url: string,
  routeType: string,
  routeConfig: CustomRouteConfig,
  routeOptions: Record<string, any>
}

wx.navigateTo({
  routeType: 'wx://bottom-sheet',
  routeConfig: {
    fullscreenDrag: true,
    popGestureDirection: 'multi'
  },
  routeOptions: {
    round: false,
  },
})

常用的 wx://bottom-sheet 預(yù)設(shè)路由 routeOptions 增加如下屬性

# 示例代碼片段

在開發(fā)者工具中預(yù)覽效果