Telegram 小程序 | TypeScript @telegram-apps/sdk @2.x | 组件 | 返回按钮

riyad

返回按钮​

💠组件 负责 Telegram Mini Apps 返回按钮 。

检查支持​

要检查当前 Telegram 小应用程序版本是否支持返回按钮，请使用 isSupported 方法：

Variable :

1. import { backButton } from '@telegram-apps/sdk';
   
2. 
   $ O1 l2 o/ c3 q, j8 t% N( e9 M
3. backButton.isSupported(); // boolean

复制代码

Functions :

1. import { isBackButtonSupported } from '@telegram-apps/sdk';
   & ]2 E8 |$ O: A# l9 t7 @8 D% a
2. 
   
3. isBackButtonSupported(); // boolean

复制代码

安装​

在使用该组件之前，有必要将其安装到配置正确的 属性中。 为此，请使用 mount 方法。 它将更新 isMounted 信号属性。

Variable :

1. import { backButton } from '@telegram-apps/sdk';
   
2. 
   * }( b* k* O6 P8 i/ Q, J2 ~
3. backButton.mount();
   " j( c9 h8 y, R, {
4. backButton.isMounted(); // true

复制代码

Functions :

1. import { mountBackButton, isBackButtonMounted } from '@telegram-apps/sdk';
   9 x/ V6 g  b. u& v
2. 
   * m6 b( p, `: M
3. mountBackButton();
   
4. isBackButtonMounted(); // true

复制代码

要卸载，请使用 unmount 方法：

Variable :

1. backButton.unmount();
   3 \' p: ~3 H# g
2. backButton.isMounted(); // false

复制代码

Functions :

1. import { unmountBackButton, isBackButtonMounted } from '@telegram-apps/sdk';
   ! o3 Q) M8 _# h
2. 
   
3. unmountBackButton();
   
4. isBackButtonMounted(); // false

复制代码

展示与隐藏​

要更改按钮的可见性，请使用 hide() 和 show() 方法。 这些方法会更新 isVisible 信号属性值。

Variable :

1. backButton.show();
   ' E- g2 h8 e8 T# i" \- J& _
2. backButton.isVisible(); // true
   
3. 
   
4. backButton.hide();
   8 A( q5 h& u1 O
5. backButton.isVisible(); // false

复制代码

Functions :

1. import {
   # V* _/ ~2 I# Z0 q* f
2.   showBackButton,
   8 Y( s& `/ L1 F4 Q
3.   hideBackButton,
   
4.   isBackButtonVisible,
   
5. } from '@telegram-apps/sdk';
   
6. 
   8 g1 r# Q; d1 }3 U
7. showBackButton();
   
8. isBackButtonVisible(); // true
   + w9 Y( p0 }1 E  w
9. 
   
10. hideBackButton();
    
11. isBackButtonVisible(); // false

复制代码

跟踪点击​

要添加按钮点击监听器，请使用 onClick 方法。 它返回一个函数，用于移除绑定的 监听器。 或者，您也可以使用 offClick 方法。

Variable :

1. function listener() {
   
2.   console.log('Clicked!');
   
3. }
   
4. 
   
5. const offClick = backButton.onClick(listener);
   
6. offClick();
   
7. // or
   
8. backButton.onClick(listener);
   ( S' U6 Q* d7 [- f+ K
9. backButton.offClick(listener);

复制代码

Functions :

1. import { onBackButtonClick, offBackButtonClick } from '@telegram-apps/sdk';
   " J0 V9 y5 v$ O7 P: W
2. 
   
3. function listener() {
   
4.   console.log('Clicked!');
   $ U' M* T# P! l3 }
5. }
   # R& p' z# S' ^; j8 x
6. 
   
7. const offClick = onBackButtonClick(listener);
   ' T8 m! ?( J/ {# E  Y& J+ I) e& P
8. offClick();
   
9. // or
   % e  f+ S2 x) T" X, w8 K
10. onBackButtonClick(listener);
    
11. offBackButtonClick(listener);

复制代码