useBase64

カテゴリ

ユーティリティ

エクスポートサイズ

769 B

最終更新日

先週

リアクティブなbase64変換。プレーンテキスト、バッファ、ファイル、キャンバス、オブジェクト、マップ、セット、画像をサポートします。

デモ

ソース

テキスト入力

Base64

バッファ入力

new ArrayBuffer(1024)

Base64

ファイル入力

Base64

画像入力

Base64

使用法

TypeScript

import { useBase64 } from '@vueuse/core'
import { Ref, ref } from 'vue'

const text = ref('')

const { base64 } = useBase64(text)

import { useBase64 } from '@vueuse/core'
import { ref } from 'vue'
const text = ref('')
const { base64 } = useBase64(text)

オブジェクト、配列、マップ、またはセットを使用する場合は、オプションでシリアライザーを提供できます。それ以外の場合、データはデフォルトのシリアライザーによってシリアライズされます。オブジェクトと配列はJSON.stringifyによって文字列に変換されます。マップとセットは、stringifyの前にそれぞれオブジェクトと配列に変換されます。

型宣言

型宣言を表示

typescript

export interface ToDataURLOptions {
  /**
   * MIME type
   */
  type?: string | undefined
  /**
   * Image quality of jpeg or webp
   */
  quality?: any
}
export interface UseBase64ObjectOptions<T> {
  serializer: (v: T) => string
}
export interface UseBase64Return {
  base64: Ref<string>
  promise: Ref<Promise<string>>
  execute: () => Promise<string>
}
export declare function useBase64(
  target: MaybeRefOrGetter<string>,
): UseBase64Return
export declare function useBase64(
  target: MaybeRefOrGetter<Blob>,
): UseBase64Return
export declare function useBase64(
  target: MaybeRefOrGetter<ArrayBuffer>,
): UseBase64Return
export declare function useBase64(
  target: MaybeRefOrGetter<HTMLCanvasElement>,
  options?: ToDataURLOptions,
): UseBase64Return
export declare function useBase64(
  target: MaybeRefOrGetter<HTMLImageElement>,
  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