Skip to content

useShare

反应式 网络共享 API。浏览器提供可以共享文本或文件内容的函数。

¥Reactive Web Share API. The Browser provides features that can share content in text or file.

必须在用户手势(例如单击按钮)后调用 share 方法。例如,它不能简单地在页面加载时调用。这是为了帮助防止滥用。

¥The share method has to be called following a user gesture like a button click. It can’t simply be called on page load for example. That’s in place to help prevent abuse.

示例

用法

¥Usage

ts
import { 
useShare
} from '@vueuse/core'
const {
share
,
isSupported
} =
useShare
()
function
startShare
() {
share
({
title
: 'Hello',
text
: 'Hello my friend!',
url
:
location
.
href
,
}) }

传递源引用

¥Passing a source ref

你可以将 ref 传递给它,源引用的更改将反映到你的共享选项中。

¥You can pass a ref to it, changes from the source ref will be reflected to your sharing options.

ts
import { 
ref
} from 'vue'
const
shareOptions
=
ref
<
ShareOptions
>({
text
: 'foo' })
const {
share
,
isSupported
} = useShare(
shareOptions
)
shareOptions
.value.text = 'bar'
share
()
js
import { ref } from 'vue'
const shareOptions = ref({ text: 'foo' })
const { share, isSupported } = useShare(shareOptions)
shareOptions.value.text = 'bar'
share()