Use type Component as vue component in launch-bar-actions.ts

This commit is contained in:
timongh 2023-02-09 16:28:19 +08:00
parent 4388cdf186
commit 0d381c3f3a
2 changed files with 17 additions and 19 deletions

View File

@ -1,4 +1,5 @@
import type { Executable, ImportedVueComponent } from '@/core/common-types'
import type { Component } from 'vue'
import type { Executable } from '@/core/common-types'
/** 表示 LaunchBar 里的一个动作 */
export interface LaunchBarAction {
@ -13,7 +14,7 @@ export interface LaunchBarAction {
/** 提供给搜索栏过滤的关键词 */
indexer?: string
/** 自定义渲染的内容, 会覆盖其他一些字段 */
content?: Executable<ImportedVueComponent>
content?: Component<{ name?: string }>
/** 用户选择此动作时要执行的代码 */
action: Executable
/** 设置删除动作, 用户可以在此动作右侧选择删除 */

View File

@ -1,4 +1,5 @@
import { h, defineComponent } from 'vue'
import { defineAsyncComponent, h } from 'vue'
import { getJson } from '@/core/ajax'
import { formData, getUID } from '@/core/utils'
@ -25,14 +26,12 @@ export const searchProvider: LaunchBarActionProvider = {
{
name: input,
icon: 'search',
content: async () =>
defineComponent({
render() {
return h('div', {
innerHTML: /* html */ `<em class="suggest-highlight">${input}</em>`,
})
},
}),
content: defineAsyncComponent(
async () => () =>
h('div', {
innerHTML: /* html */ `<em class="suggest-highlight">${input}</em>`,
}),
),
action: () => search(input),
},
]
@ -47,14 +46,12 @@ export const searchProvider: LaunchBarActionProvider = {
...suggests.map(result => ({
name: result.value,
icon: 'search',
content: async () =>
defineComponent({
render() {
return h('div', {
innerHTML: result.name.replace(/suggest_high_light/g, 'suggest-highlight'),
})
},
}),
content: defineAsyncComponent(
async () => () =>
h('div', {
innerHTML: result.name.replace(/suggest_high_light/g, 'suggest-highlight'),
}),
),
action: () => search(result.value),
})),
)