useShare
响应式 Web Share API。浏览器提供了可以共享文本或文件内容的功能。
share方法必须在用户手势（如按钮点击）后调用。例如，它不能简单地在页面加载时调用。这样做是为了帮助防止滥用。
演示
用法
js
import { useShare } from '@vueuse/core'
const { share, isSupported } = useShare()
function startShare() {
share({
title: 'Hello',
text: 'Hello my friend!',
url: location.href,
})
}传递源 ref
你可以传递一个 ref 给它，来自源 ref 的更改将反映到你的共享选项。
ts
import { ref } from 'vue'
const shareOptions = ref<ShareOptions>({ text: 'foo' })
const { share, isSupported } = useShare(shareOptions)
shareOptions.value.text = 'bar'
js
import { ref } from 'vue'
const shareOptions = ref({ text: 'foo' })
const { share, isSupported } = useShare(shareOptions)
shareOptions.value.text = 'bar'
share()类型声明
typescript
export interface UseShareOptions {
title?: string
files?: File[]
text?: string
url?: string
}
/**
* Reactive Web Share API.
*
* @see https://vueuse.org.cn/useShare
* @param shareOptions
* @param options
*/
export declare function useShare(
shareOptions?: MaybeRefOrGetter<UseShareOptions>,
options?: ConfigurableNavigator,
): {
isSupported: ComputedRef<boolean>
share: (overrideOptions?: MaybeRefOrGetter<UseShareOptions>) => Promise<void>
}
export type UseShareReturn = ReturnType<typeof useShare>源代码
贡献者
Anthony Fu
Antério Vieira
Anthony Fu
Jelf
IlyaL
无尘室内点墨
三咲智子 Kevin Deng
Shinigami
João Eudes Lima