diff --git a/api/@ohos.arkui.observer.d.ts b/api/@ohos.arkui.observer.d.ts
index 29af3503e28d49e2c453312902b592d5ba136eda..38ae16c61ba2eac6f012f73972d15e4df71d8653 100644
--- a/api/@ohos.arkui.observer.d.ts
+++ b/api/@ohos.arkui.observer.d.ts
@@ -664,7 +664,19 @@ declare namespace uiObserver {
      * @atomicservice
      * @since 12
      */
-    uniqueId: number
+    uniqueId: number,
+
+    /**
+     * The last focus index of TabContent in Tabs.
+     *
+     * @type { number }
+     * @syscap SystemCapability.ArkUI.ArkUI.Full
+     * @crossplatform
+     * @atomicservice
+     * @since 22
+     */
+    lastIndex?: number,
+
   }
 
     /**
@@ -1196,6 +1208,61 @@ declare namespace uiObserver {
 
   /**
    * Registers a callback function to be called when the tabContent is showed or hidden.
+   * Include the cases when the first tab content shows and when the tab changes current index.
+   *
+   * @param { 'tabChange' } type - The type of event to listen for. Must be 'tabChange'.
+   * @param { ObserverOptions } options - The options object. Includes the observed component id.
+   * @param { Callback<TabContentInfo> } callback - The callback function to be called when when the tabContent is showed or hidden.
+   * @syscap SystemCapability.ArkUI.ArkUI.Full
+   * @crossplatform
+   * @atomicservice
+   * @since 22
+   */
+  export function on(type: 'tabChange', options: ObserverOptions, callback: Callback<TabContentInfo>): void;
+
+  /**
+   * Removes a callback function that was previously registered with `on()`.
+   *
+   * @param { 'tabChange' } type - The type of event to remove the listener for. Must be 'tabChange'.
+   * @param { ObserverOptions } options - The options object. Includes the observed component id.
+   * @param { Callback<TabContentInfo> } callback - The callback function to remove. If not provided, all callbacks for the given event type and
+   *                                                    Tabs ID will be removed.
+   * @syscap SystemCapability.ArkUI.ArkUI.Full
+   * @crossplatform
+   * @atomicservice
+   * @since 22
+   */
+  export function off(type: 'tabChange', options: ObserverOptions, callback?: Callback<TabContentInfo>): void;
+
+  /**
+   * Registers a callback function to be called when the tabContent is showed or hidden.
+   * Include the cases when the first tab content shows and when the tab changes current index.
+   *
+   * @param { 'tabChange' } type - The type of event to listen for. Must be 'tabChange'.
+   * @param { Callback<TabContentInfo> } callback - The callback function to be called when the tabContent is showed or hidden.
+   * @syscap SystemCapability.ArkUI.ArkUI.Full
+   * @crossplatform
+   * @atomicservice
+   * @since 22
+   */
+  export function on(type: 'tabChange', callback: Callback<TabContentInfo>): void;
+
+  /**
+   * Removes a callback function that was previously registered with `on()`.
+   *
+   * @param { 'tabChange'} type - The type of event to remove the listener for. Must be 'tabChange'.
+   * @param { Callback<TabContentInfo> } [callback] - The callback function to remove. If not provided, all callbacks for the given event type
+   *                                                      will be removed.
+   * @syscap SystemCapability.ArkUI.ArkUI.Full
+   * @crossplatform
+   * @atomicservice
+   * @since 22
+   */
+  export function off(type: 'tabChange', callback?: Callback<TabContentInfo>): void;
+
+  /**
+   * Registers a callback function to be called when the tabContent is showed or hidden.
+   * Only calls when the tab changes index.
    *
    * @param { 'tabContentUpdate' } type - The type of event to listen for. Must be 'tabContentUpdate'.
    * @param { ObserverOptions } options - The options object.
@@ -1204,6 +1271,8 @@ declare namespace uiObserver {
    * @crossplatform
    * @atomicservice
    * @since 12
+   * @deprecated since 22
+   * @useinstead uiObserver.on('tabChange')
    */
   export function on(type: 'tabContentUpdate', options: ObserverOptions, callback: Callback<TabContentInfo>): void;
 
@@ -1218,11 +1287,14 @@ declare namespace uiObserver {
    * @crossplatform
    * @atomicservice
    * @since 12
+   * @deprecated since 22
+   * @useinstead uiObserver.off('tabChange')
    */
   export function off(type: 'tabContentUpdate', options: ObserverOptions, callback?: Callback<TabContentInfo>): void;
 
   /**
    * Registers a callback function to be called when the tabContent is showed or hidden.
+   * Only calls when the tab changes index.
    *
    * @param { 'tabContentUpdate' } type - The type of event to listen for. Must be 'tabContentUpdate'.
    * @param { Callback<TabContentInfo> } callback - The callback function to be called when the tabContent is showed or hidden.
@@ -1230,6 +1302,8 @@ declare namespace uiObserver {
    * @crossplatform
    * @atomicservice
    * @since 12
+   * @deprecated since 22
+   * @useinstead uiObserver.on('tabChange')
    */
   export function on(type: 'tabContentUpdate', callback: Callback<TabContentInfo>): void;
 
@@ -1243,6 +1317,8 @@ declare namespace uiObserver {
    * @crossplatform
    * @atomicservice
    * @since 12
+   * @deprecated since 22
+   * @useinstead uiObserver.off('tabChange')
    */
   export function off(type: 'tabContentUpdate', callback?: Callback<TabContentInfo>): void;