useBase64

分类

实用工具

导出大小

794 B

上次更改

8 个月前

响应式 Base64 转换。支持纯文本、缓冲区、文件、画布、对象、映射、集合和图片。

演示

源代码在线演练 (测试版)

文本输入

Base64

缓冲区输入

new ArrayBuffer(1024)

Base64

文件输入

Base64

图片输入

Base64

用法

import { useBase64
 } from '@vueuse/core'
import { shallowRef
 } from 'vue'

const text
 = shallowRef
('')

const { base64
 } = useBase64
(text
)

如果使用对象、数组、映射或集合，可以在选项中提供序列化器。否则，您的数据将由默认序列化器序列化。对象和数组将通过 JSON.stringify 转换为字符串。映射和集合将在字符串化之前分别转换为对象和数组。

类型声明

显示类型声明

export interface UseBase64Options {
  /**
   * Output as Data URL format
   *
   * @default true
   */
  dataUrl
?: boolean
}
export interface ToDataURLOptions extends UseBase64Options {
  /**
   * MIME type
   */
  type
?: string | undefined
  /**
   * Image quality of jpeg or webp
   */
  quality
?: any
}
export interface UseBase64ObjectOptions
<T
> extends UseBase64Options {
  serializer
?: (v
: T
) => string
}
export interface UseBase64Return {
  base64
: ShallowRef
<string>
  promise
: ShallowRef
<Promise
<string>>
  execute
: () => Promise
<string>
}
export declare function useBase64
(
  target
: MaybeRefOrGetter
<string | undefined>,
  options
?: UseBase64Options,
): UseBase64Return
export declare function useBase64
(
  target
: MaybeRefOrGetter
<Blob | undefined>,
  options
?: UseBase64Options,
): UseBase64Return
export declare function useBase64
(
  target
: MaybeRefOrGetter
<ArrayBuffer | undefined>,
  options
?: UseBase64Options,
): UseBase64Return
export declare function useBase64
(
  target
: MaybeRefOrGetter
<HTMLCanvasElement | undefined>,
  options
?: ToDataURLOptions,
): UseBase64Return
export declare function useBase64
(
  target
: MaybeRefOrGetter
<HTMLImageElement | undefined>,
  options
?: ToDataURLOptions,
): UseBase64Return
export declare function useBase64
<T
 extends Record
<string, unknown>>(
  target
: MaybeRefOrGetter
<T
>,
  options
?: UseBase64ObjectOptions
<T
>,
): UseBase64Return
export declare function useBase64
<T
 extends Map
<string, unknown>>(
  target
: MaybeRefOrGetter
<T
>,
  options
?: UseBase64ObjectOptions
<T
>,
): UseBase64Return
export declare function useBase64
<T
 extends Set
<unknown>>(
  target
: MaybeRefOrGetter
<T
>,
  options
?: UseBase64ObjectOptions
<T
>,
): UseBase64Return
export declare function useBase64
<T
>(
  target
: MaybeRefOrGetter
<T
[]>,
  options
?: UseBase64ObjectOptions
<T
[]>,
): UseBase64Return