MpxUseuseClipboard
调用剪贴板复制内容
Usage
js
import { useClipboard } from '@mpxjs/mpxuse-core'
const source = ref('Hello')
const { text, copy, copied, flush } = useClipboard({ source })
defineExpose({
source,
text,
flush,
copy,
copied
})
import { useClipboard } from '@mpxjs/mpxuse-core'
const source = ref('Hello')
const { text, copy, copied, flush } = useClipboard({ source })
defineExpose({
source,
text,
flush,
copy,
copied
})
html
<button bindtap='copy'>
<!-- by default, `copied` will be reset in 1.5s -->
<view wx:if='{{!copied}}'>Copy</view>
<view wx:else>Copied!</view>
</button>
<button bindtap='copy'>
<!-- by default, `copied` will be reset in 1.5s -->
<view wx:if='{{!copied}}'>Copy</view>
<view wx:else>Copied!</view>
</button>
类型声明
typescript
export interface UseClipboardOptions<Source> {
/**
* Copy source
*/
source?: Source
/**
* Milliseconds to reset state of `copied` ref
*
* @default 1500
*/
copiedDuring?: number
}
export interface UseClipboardReturn<Optional> {
text: ComputedRef<string>
copied: ComputedRef<boolean>
copy: Optional extends true
? (text?: string) => Promise<void>
: (text: string) => Promise<void>
flush: Optional extends true
? (text?: string) => Promise<void>
: (text: string) => Promise<void>
}
/**
* Reactive Clipboard API.
*
* @see https://mpxuse.cn/useClipboard
* @param options
*/
export declare function useClipboard(
options?: UseClipboardOptions<undefined>
): UseClipboardReturn<false>
export declare function useClipboard(
options: UseClipboardOptions<MaybeComputedRef<string>>
): UseClipboardReturn<true>
export interface UseClipboardOptions<Source> {
/**
* Copy source
*/
source?: Source
/**
* Milliseconds to reset state of `copied` ref
*
* @default 1500
*/
copiedDuring?: number
}
export interface UseClipboardReturn<Optional> {
text: ComputedRef<string>
copied: ComputedRef<boolean>
copy: Optional extends true
? (text?: string) => Promise<void>
: (text: string) => Promise<void>
flush: Optional extends true
? (text?: string) => Promise<void>
: (text: string) => Promise<void>
}
/**
* Reactive Clipboard API.
*
* @see https://mpxuse.cn/useClipboard
* @param options
*/
export declare function useClipboard(
options?: UseClipboardOptions<undefined>
): UseClipboardReturn<false>
export declare function useClipboard(
options: UseClipboardOptions<MaybeComputedRef<string>>
): UseClipboardReturn<true>
源码
贡献者
pagnkelly