onThemeChange

• Category: Events
• Relate: onThemeChange
• Dependencies: @lark-base-open/js-sdk
• Last Changed: 20 hours ago

提示

该函数需要在一个多维表格中使用，请将本文档作为一个插件在多维表格上使用以查看演示。

演示

Source

显示演示代码

demo.vue

<script setup lang="ts">
import { onThemeChange } from "@qww0302/use-bitable";
import { bitable } from "@lark-base-open/js-sdk";
import { ref, onMounted } from "vue";

const theme = ref("LIGHT");

onThemeChange({
  callback: (t) => {
    theme.value = t;
  }
});

onMounted(() => {
  bitable.bridge.getTheme().then((t) => {
    theme.value = t;
  });
});
</script>

<template>
  <div>Current theme: {{ theme }}</div>
</template>

用法

类型声明

import type {
  ThemeModeType,
  IDashboard,
  IBridge,
  IDashboardTheme,
} from "@lark-base-open/js-sdk"
export interface OnThemeChangeOption<T extends IBridge | IDashboard> {
  /**
   * The target object(bridge or dashboard) to get the theme
   *
   * 获取主题的目标对象( bridge 或 dashboard )
   *
   * @default bridge
   * @type {IBridge | IDashboard}
   */
  target?: T
  callback: (theme: T extends IBridge ? ThemeModeType : IDashboardTheme) => void
}
export declare function onThemeChange(
  callback: (theme: ThemeModeType) => void,
): () => void
export declare function onThemeChange(
  option: OnThemeChangeOption<IBridge>,
): () => void
export declare function onThemeChange(
  option: OnThemeChangeOption<IDashboard>,
): void
export declare function onThemeChange<T extends IDashboard | IBridge>(
  option: OnThemeChangeOption<T>,
): void | (() => void)