函数 InteractiveQuestion

InteractiveQuestion(props: InteractiveQuestionProps): null | Element
一个渲染交互式问题的组件。
参数
- props: InteractiveQuestionProps
  - 可选children?: ReactNode
    MetabaseProvider 组件的子元素。
  - 可选className?: string
    要添加到根元素的自定义类名。
  - 可选entityTypes?: EmbeddingEntityType[]
    一个数组，指定数据选择器中可用的实体类型。
  - 可选height?: Height<string | number>
    一个数字或字符串，指定组件高度的CSS尺寸值。
  - 可选initialSqlParameters?: SqlParameterValues
    SQL 参数的初始值。
  - 可选isSaveEnabled?: boolean
    是否显示保存按钮。
  - 可选onBeforeSave?: (
    question: undefined | MetabaseQuestion,
    context: { isNewQuestion: boolean },
    ) => Promise<void>
    在保存前触发的回调函数。仅当 isSaveEnabled = true 时相关。
  - 可选onRun?: (question: undefined | MetabaseQuestion) => void
    当问题更新时（包括用户点击问题编辑器中的 Visualize 按钮时）触发的回调函数。
  - 可选onSave?: (
    question: undefined | MetabaseQuestion,
    context: { isNewQuestion: boolean },
    ) => void
    当用户保存问题时触发的回调函数。仅当 isSaveEnabled = true 时相关。
  - 可选plugins?: MetabasePluginsConfig
  - questionId: null | SdkQuestionId
    问题的ID。
    这可以是
    
    访问问题链接时的数字ID，例如 http://localhost:3000/question/1-my-question，其中ID为 1
    
    问题对象的 entity_id 键。您可以在查看问题时在信息面板中找到问题的实体ID。
    
    new 用于显示笔记本编辑器以创建新问题。isSaveEnabled 必须为 true 才能允许保存问题。
  - 可选style?: CSSProperties
    要添加到根元素的自定义样式对象。
  - 可选targetCollection?: SdkCollectionId
    保存问题的集合。这将从保存模态框中隐藏集合选择器。仅适用于交互式问题。
  - 可选title?: SdkQuestionTitleProps
    确定是否显示问题标题，并允许显示自定义标题而不是默认问题标题。默认显示。仅在使用默认布局时适用于交互式问题。
  - 可选width?: Width<string | number>
    一个数字或字符串，指定组件宽度的CSS尺寸值。
  - 可选withChartTypeSelector?: boolean
    确定是否显示图表类型选择器和相应的设置按钮。仅在使用默认布局时相关。
  - 可选withDownloads?: boolean
    启用在交互式问题中下载结果的功能。
  - 可选withResetButton?: boolean
    确定是否显示重置按钮。仅在使用默认布局时相关。
返回 null | Element

交互式问题

返回按钮

BackButton: (props: InteractiveQuestionBackButtonProps) => null | Element

类型声明

- (props: InteractiveQuestionBackButtonProps): null | Element
- 函数
  一个导航按钮，返回上一个视图。仅在 InteractiveDashboardProps.renderDrillThroughQuestion 属性中渲染时可见。
  参数
  - props: InteractiveQuestionBackButtonProps
  返回 null | Element

分组

Breakout: () => null | Element

类型声明

- (): null | Element
- 函数
  一组用于管理数据分组（分组）的徽章。使用问题上下文实现分组功能。
  
  返回 null | Element

分组下拉菜单

BreakoutDropdown: (
props: InteractiveQuestionBreakoutDropdownProps,
) => null | Element

类型声明

- (props: InteractiveQuestionBreakoutDropdownProps): null | Element
- 函数
  分组组件的下拉按钮。
  参数
  - props: InteractiveQuestionBreakoutDropdownProps
  返回 null | Element

图表类型下拉菜单

ChartTypeDropdown: (props: MenuProps) => Element

类型声明

- (props: MenuProps): Element
- 函数
  用于选择可视化类型（条形图、折线图、表格等）的下拉菜单。自动更新以显示当前数据的推荐可视化类型。
  参数
  - props: MenuProps
  返回 Element

图表类型选择器

ChartTypeSelector: (props: StackProps) => Element

类型声明

- (props: StackProps): Element
- 函数
  详细的图表类型选择界面，包含推荐的可视化选项。
  参数
  - props: StackProps
  返回 Element

下载小部件

DownloadWidget: (props: StackProps) => null | Element

类型声明

- (props: StackProps): null | Element
- 函数
  提供一个UI小部件，用于下载不同格式的数据（根据可视化类型，包括CSV、XLSX、JSON和PNG）。
  参数
  - props: StackProps
  返回 null | Element

下载小部件下拉菜单

DownloadWidgetDropdown: (props: PopoverProps) => Element

类型声明

- (props: PopoverProps): Element
- 函数
  提供一个包含显示 DownloadWidget 的下拉菜单的按钮。
  参数
  - props: PopoverProps
  返回 Element

编辑器

Editor: (props: InteractiveQuestionEditorProps) => undefined | Element

类型声明

- (props: InteractiveQuestionEditorProps): undefined | Element
- 函数
  高级查询编辑器，提供对问题配置的完全访问。包括筛选、聚合、自定义表达式和联接。
  参数
  - props: InteractiveQuestionEditorProps
    - 可选hasVisualizeButton?: boolean
    - 可选onApply?: () => void
      应用更改时执行的回调函数
  返回 undefined | Element

编辑器按钮

EditorButton: (
props: InteractiveQuestionEditorButtonProps,
) => undefined | false | Element

类型声明

- (props: InteractiveQuestionEditorButtonProps): undefined | false | Element
- 函数
  用于显示/隐藏编辑器界面的切换按钮。在自定义布局中，EditorButton 必须有一个 InteractiveQuestionEditorButtonProps.onClick` 处理程序，否则点击按钮将无效。
  参数
  - props: InteractiveQuestionEditorButtonProps
    - 可选isOpen?: boolean
      编辑器当前是否打开
      
      默认值
      false
    - 可选onClick?: MouseEventHandler<HTMLButtonElement>
      点击按钮时要调用的回调函数
  返回 undefined | false | Element

筛选器

Filter: (props: InteractiveQuestionFilterProps) => Element

类型声明

- (props: InteractiveQuestionFilterProps): Element
- 函数
  一组交互式筛选器徽章，允许添加、编辑和移除筛选器。以徽章形式显示当前筛选器，并提供“添加另一个筛选器”选项。
  参数
  - props: InteractiveQuestionFilterProps
    - 可选withColumnItemIcon?: boolean
      是否显示列项的图标
  返回 Element

筛选器下拉菜单

FilterDropdown: (
props: InteractiveQuestionFilterDropdownProps,
) => null | Element

类型声明

- (props: InteractiveQuestionFilterDropdownProps): null | Element
- 函数
  筛选器组件的下拉按钮。
  参数
  - props: InteractiveQuestionFilterDropdownProps
    - 可选withColumnItemIcon?: boolean
      是否显示列项的图标
  返回 null | Element

笔记本

Notebook: (props: InteractiveQuestionEditorProps) => undefined | Element

类型声明

- (props: InteractiveQuestionEditorProps): undefined | Element
- 函数
  高级查询编辑器，提供对问题配置的完全访问。包括筛选、聚合、自定义表达式和联接。
  参数
  - props: InteractiveQuestionEditorProps
    - 可选hasVisualizeButton?: boolean
    - 可选onApply?: () => void
      应用更改时执行的回调函数
  返回 undefined | Element

已弃用

请改用 InteractiveQuestion.Editor

笔记本按钮

NotebookButton: (
props: InteractiveQuestionEditorButtonProps,
) => undefined | false | Element

类型声明

- (props: InteractiveQuestionEditorButtonProps): undefined | false | Element
- 函数
  用于显示/隐藏编辑器界面的切换按钮。在自定义布局中，EditorButton 必须有一个 InteractiveQuestionEditorButtonProps.onClick` 处理程序，否则点击按钮将无效。
  参数
  - props: InteractiveQuestionEditorButtonProps
    - 可选isOpen?: boolean
      编辑器当前是否打开
      
      默认值
      false
    - 可选onClick?: MouseEventHandler<HTMLButtonElement>
      点击按钮时要调用的回调函数
  返回 undefined | false | Element

已弃用

请改用 InteractiveQuestion.EditorButton

问题设置

QuestionSettings: (props: StackProps) => null | Element

类型声明

- (props: StackProps): null | Element
- 函数
  用于配置可视化选项（如坐标轴、颜色和格式）的设置面板。使用问题上下文进行设置。
  参数
  - props: StackProps
  返回 null | Element

问题设置下拉菜单

QuestionSettingsDropdown: (
props?: InteractiveQuestionQuestionSettingsDropdownProps,
) => Element

类型声明

- (props?: InteractiveQuestionQuestionSettingsDropdownProps): Element
- 函数
  包含 QuestionSettings 组件的下拉按钮。
  参数
  - 可选props: InteractiveQuestionQuestionSettingsDropdownProps
    - 可选height?: Height<string | number>
      下拉菜单的高度
  返回 Element

问题可视化

QuestionVisualization: (
    props: { className?: string; style?: CSSProperties } & {
        height?: Height<string | number>;
        width?: Width<string | number>;
    } & {},
) => Element

类型声明

- (
      props: { className?: string; style?: CSSProperties } & {
          height?: Height<string | number>;
          width?: Width<string | number>;
      } & {},
  ): Element
- 函数
  主可视化组件，将问题结果渲染为图表、表格或其他可视化类型。
  参数
  - props: { className?: string; style?: CSSProperties } & {
    height?: Height<string | number>;
    width?: Width<string | number>;
    } & {}
    - 可选className?: string
      要添加到根元素的自定义类名。
    - 可选style?: CSSProperties
      要添加到根元素的自定义样式对象。
    - 可选height?: Height<string | number>
      一个数字或字符串，指定组件高度的CSS尺寸值。
    - 可选width?: Width<string | number>
      一个数字或字符串，指定组件宽度的CSS尺寸值。
  返回 Element

重置按钮

ResetButton: (props?: ButtonProps) => null | Element

类型声明

- (props?: ButtonProps): null | Element
- 函数
  重置问题修改的按钮。仅当问题有未保存的更改时显示。
  参数
  - 可选props: ButtonProps
  返回 null | Element

保存按钮

SaveButton: (props?: InteractiveQuestionSaveButtonProps) => Element

类型声明

- (props?: InteractiveQuestionSaveButtonProps): Element
- 函数
  保存问题更改的按钮。仅当问题有未保存的修改时启用。
  
  注意：目前，在自定义布局中，SaveButton 必须有一个 onClick 处理程序，否则点击按钮将无效。
  参数
  - 可选props: InteractiveQuestionSaveButtonProps
    - 可选onClick?: MouseEventHandler<HTMLButtonElement>
      点击按钮时要调用的处理函数
  返回 Element

保存问题表单

SaveQuestionForm: (
props: InteractiveQuestionSaveQuestionFormProps,
) => null | Element

类型声明

- (props: InteractiveQuestionSaveQuestionFormProps): null | Element
- 函数
  用于保存问题（包括标题和描述）的表单。保存时
  - 对于现有问题：调用 InteractiveQuestionProps.onSave
  - 两个回调都接收更新后的问题对象
  - 可以通过 InteractiveQuestionSaveQuestionFormProps.onCancel 取消表单
  参数
  - props: InteractiveQuestionSaveQuestionFormProps
    - 可选onCancel?: () => void
      保存取消时执行的回调函数
  返回 null | Element

汇总

Summarize: () => Element

类型声明

- (): Element
- 函数
  用于添加和管理数据汇总（如计数、总和、平均值）的界面。显示为一组徽章。使用问题上下文实现汇总功能。
  
  返回 Element

汇总下拉菜单

SummarizeDropdown: (props: InteractiveQuestionSummarizeDropdownProps) => Element

类型声明

- (props: InteractiveQuestionSummarizeDropdownProps): Element
- 函数
  汇总组件的下拉按钮。
  参数
  - props: InteractiveQuestionSummarizeDropdownProps
  返回 Element

标题

Title: (
props: { className?: string; style?: CSSProperties },
) => undefined | Element

类型声明

- (props: { className?: string; style?: CSSProperties }): undefined | Element
- 函数
  根据问题的状态显示标题。显示
  - 如果问题已保存，则显示其名称
  - 针对临时问题（非原生查询）自动生成的描述
  - 作为回退或针对新/原生查询显示“新问题”
  参数
  - props: { className?: string; style?: CSSProperties }
    - 可选className?: string
      要添加到根元素的自定义类名。
    - 可选style?: CSSProperties
      要添加到根元素的自定义样式对象。
  返回 undefined | Element

其他

可视化按钮

VisualizationButton: () => null | Element

函数 InteractiveQuestion

参数

可选children?: ReactNode

可选className?: string

可选entityTypes?: EmbeddingEntityType[]

可选height?: Height<string | number>

可选initialSqlParameters?: SqlParameterValues

可选isSaveEnabled?: boolean

可选onBeforeSave?: ( question: undefined | MetabaseQuestion, context: { isNewQuestion: boolean },) => Promise<void>

可选onRun?: (question: undefined | MetabaseQuestion) => void

可选onSave?: ( question: undefined | MetabaseQuestion, context: { isNewQuestion: boolean },) => void

可选plugins?: MetabasePluginsConfig

questionId: null | SdkQuestionId

可选style?: CSSProperties

可选targetCollection?: SdkCollectionId

可选title?: SdkQuestionTitleProps

可选width?: Width<string | number>

可选withChartTypeSelector?: boolean

可选withDownloads?: boolean

可选withResetButton?: boolean

返回 null | Element

索引

交互式问题

其他

交互式问题

返回按钮

类型声明

参数

返回 null | Element

分组

类型声明

返回 null | Element

分组下拉菜单

类型声明

参数

返回 null | Element

图表类型下拉菜单

类型声明

参数

返回 Element

图表类型选择器

类型声明

参数

返回 Element

下载小部件

类型声明

参数

返回 null | Element

下载小部件下拉菜单

类型声明

参数

返回 Element

编辑器

类型声明

参数

可选hasVisualizeButton?: boolean

可选onApply?: () => void

返回 undefined | Element

编辑器按钮

类型声明

参数

可选isOpen?: boolean

默认值

可选onClick?: MouseEventHandler<HTMLButtonElement>

返回 undefined | false | Element

筛选器

类型声明

参数

可选withColumnItemIcon?: boolean

返回 Element

筛选器下拉菜单

类型声明

参数

可选withColumnItemIcon?: boolean

返回 null | Element

笔记本

类型声明

参数

可选hasVisualizeButton?: boolean

可选onApply?: () => void

`可选`children?: ReactNode

`可选`className?: string

`可选`entityTypes?: EmbeddingEntityType[]

`可选`height?: Height<string | number>

`可选`initialSqlParameters?: SqlParameterValues

`可选`isSaveEnabled?: boolean

`可选`onBeforeSave?: (
question: undefined | MetabaseQuestion,
context: { isNewQuestion: boolean },
) => Promise<void>

`可选`onRun?: (question: undefined | MetabaseQuestion) => void

`可选`onSave?: (
question: undefined | MetabaseQuestion,
context: { isNewQuestion: boolean },
) => void

`可选`plugins?: MetabasePluginsConfig

`可选`style?: CSSProperties

`可选`targetCollection?: SdkCollectionId

`可选`title?: SdkQuestionTitleProps

`可选`width?: Width<string | number>

`可选`withChartTypeSelector?: boolean

`可选`withDownloads?: boolean

`可选`withResetButton?: boolean

`可选`hasVisualizeButton?: boolean

`可选`onApply?: () => void

`可选`isOpen?: boolean

`可选`onClick?: MouseEventHandler<HTMLButtonElement>

`可选`withColumnItemIcon?: boolean

`可选`withColumnItemIcon?: boolean

`可选`hasVisualizeButton?: boolean

`可选`onApply?: () => void

`可选`isOpen?: boolean

`可选`onClick?: MouseEventHandler<HTMLButtonElement>

`可选`height?: Height<string | number>

`可选`className?: string

`可选`style?: CSSProperties

`可选`height?: Height<string | number>

`可选`width?: Width<string | number>

`可选`onClick?: MouseEventHandler<HTMLButtonElement>

`可选`onCancel?: () => void

`可选`className?: string

`可选`style?: CSSProperties