Telegram 小程序 | TypeScript @telegram-apps/bridge | 事件

riyad

本文涵盖与 apps communication 事件相关的主题。
; P. g0 a, g1 d. V( M6 x; r

定义事件处理程序​

为避免副作用，该软件包在导入时不会调用任何函数。 Telegram 迷你应用程序 需要在本地 Telegram 应用程序和迷你应用程序之间使用特定的通信方式，其中涉及在全局 window 对象中定义某些方法。

要启用此功能并开始接收 Telegram 迷你应用程序事件，请使用 defineEventHandlers 函数：

1. import { defineEventHandlers } from '@telegram-apps/bridge';
   
2. 
   
3. defineEventHandlers();

复制代码

这种设置通过监听 和处理必要的事件，确保迷你应用能与原生 Telegram 应用正确交互。

( P1 |+ g1 E( p+ `' bon 和 off​

要开始处理事件，需要使用 on 和 off 函数。

下面是 on 函数的一个基本示例：

1. import { on } from '@telegram-apps/bridge';
   
2. 
   
3. // Start listening to the "viewport_changed" event. The returned value
   
4. // is a function that removes this event listener.
   
5. const removeListener = on('viewport_changed', (payload) => {
   
6.   console.log('Viewport changed:', payload);
   ' U6 F! a9 f* `: j! Q4 b0 I
7. });
   
8. 
   
9. // Remove this event listener.
   ! B0 b+ i( c& X! k
10. removeListener();

复制代码

另外，要停止监听事件，开发人员可以使用 off 功能：

1. import { on, off, type EventListener } from '@telegram-apps/bridge';
   
2. 
   2 m6 G/ j- A: a, n4 w3 k$ k3 `
3. const listener: EventListener<'viewport_changed'> = (payload) => {
   
4.   console.log('Viewport changed:', payload);
   
5. };
   
6. 
   9 h  l; z1 H) z7 A8 Z( L
7. // Start listening to the event.
   
8. on('viewport_changed', listener);
   1 N; l0 f7 p' ^; m7 {7 T8 |  I
9. 
   
10. // Remove the event listener.
    : R. ^3 W4 t& N2 j
11. off('viewport_changed', listener);

复制代码

1 V' y9 A$ f/ N: a( ^% v# R+ I* B. k

要只调用监听器一次，则使用第三个布尔参数：

1. import { on } from '@telegram-apps/bridge';
   
2. 
   7 w) ~6 E* a5 m( ?
3. // Will automatically be removed after the first listener execution.
   
4. on('viewport_changed', (payload) => {
   * ^+ b7 i' }' ^5 {* F
5.   console.log('Viewport changed:', payload);
   
6. }, true);

复制代码

subscribe 和 unsubscribe​
2 c1 Q+ g8 Z1 S9 ~

要监听本地 Telegram 应用程序发送的所有事件，需要使用 subscribe 和 unsubscribe 功能：

import {
  subscribe,
  unsubscribe,
5 E3 ^  b8 b: d. e* n9 _! @  type SubscribeListener,
} from '@telegram-apps/bridge';
: s6 A' z- {4 ~% c" K
% F/ O3 a) k3 R' B' q# f+ ^$ A2 [const listener: SubscribeListener = (event) => {
  console.log('Received event', event);
};
2 ~  v: u( D: s7 {2 [  H% E0 a
( a  Z5 C5 L8 X7 ]/ l# b// Listen to all events.
subscribe(listener);

// Remove the listener.
) @5 D4 I6 R" X3 A1 Punsubscribe(listener);

9 V, U) p6 ?  E( j
3 H7 A  G5 u# ~- J& @8 r5 ?

' L3 o+ S" n! F" Z