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

riyad

本文涵盖与 apps communication 事件相关的主题。
& Q0 s7 {0 ?2 N$ y

* U- e6 U0 L9 ^1 b定义事件处理程序​

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

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

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

复制代码

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

& b( S) z/ {4 P' E+ K/ O$ |on 和 off​

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

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

1. import { on } from '@telegram-apps/bridge';
   - t, s$ Y3 O% r/ R7 u
2. 
   7 S6 o  u7 Q9 \" u  h
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) => {
   : f& n' |, _! o  u; W" ?
6.   console.log('Viewport changed:', payload);
   3 E2 @1 ~; N2 S# c2 w! p% s6 w
7. });
   4 v0 p- G5 E0 q" j7 ]6 u
8. 
   
9. // Remove this event listener.
   % X; ?6 }1 C! |7 R2 [0 y2 @
10. removeListener();

复制代码

' ?3 ~& e0 T7 p( f/ j. H: f7 Y: v

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

1. import { on, off, type EventListener } from '@telegram-apps/bridge';
   9 k0 q& k. N/ z6 \( |4 M/ W8 W, s
2. 
     O" g* e. _1 i" {
3. const listener: EventListener<'viewport_changed'> = (payload) => {
   
4.   console.log('Viewport changed:', payload);
   
5. };
   1 }$ n4 _9 D0 J/ I
6. 
   . Y1 T" g" J$ [; |+ ^9 I& m  V
7. // Start listening to the event.
   
8. on('viewport_changed', listener);
   - i4 |2 k! f2 s  D/ M+ k
9. 
   
10. // Remove the event listener.
    5 K6 D8 ]2 r# o; B  |; f
11. off('viewport_changed', listener);

复制代码

* r" ~. P% u. ]& i0 @

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

1. import { on } from '@telegram-apps/bridge';
   
2. 
   
3. // Will automatically be removed after the first listener execution.
   
4. on('viewport_changed', (payload) => {
   
5.   console.log('Viewport changed:', payload);
   
6. }, true);

复制代码

subscribe 和 unsubscribe​
, t1 P# D: M0 _& [. u" i' x" T

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

import {
  subscribe,
  unsubscribe,
  type SubscribeListener,
& c7 _- }$ G& i" I  L0 z} from '@telegram-apps/bridge';

const listener: SubscribeListener = (event) => {
+ u; ^3 t9 C2 H% u4 Z) v. t6 `  console.log('Received event', event);
};
6 A% [9 j2 `# g. K6 Y+ S. c; R
// Listen to all events.
subscribe(listener);

// Remove the listener.
1 {- G. n& H/ X3 ounsubscribe(listener);

3 ?( h' Z& P6 l! h

/ g# _$ o% ?  |& W( P

% h& F* e3 }- E' y. D


, k. z$ ^+ ?* J6 n