https://github.com/vitorluizc/use-object-url

React Hook to create and revoke URL for any instance of `File`, `Blob` or `MediaSource`.
https://github.com/vitorluizc/use-object-url

hacktoberfest javascript react react-hook typescript

Last synced: 8 months ago
JSON representation

React Hook to create and revoke URL for any instance of `File`, `Blob` or `MediaSource`.

• Host: GitHub
• URL: https://github.com/vitorluizc/use-object-url
• Owner: VitorLuizC
• License: mit
• Created: 2019-09-01T17:47:30.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2022-12-10T00:43:08.000Z (about 3 years ago)
• Last Synced: 2025-04-09T06:35:47.801Z (10 months ago)
• Topics: hacktoberfest, javascript, react, react-hook, typescript
• Language: TypeScript
• Homepage:
• Size: 839 KB
• Stars: 12
• Watchers: 2
• Forks: 0
• Open Issues: 18
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# useObjectURL

[![Build Status](https://travis-ci.org/VitorLuizC/use-object-url.svg?branch=master)](https://travis-ci.org/VitorLuizC/use-object-url)

[![License](https://badgen.net/github/license/VitorLuizC/use-object-url)](./LICENSE)

[![Library minified size](https://badgen.net/bundlephobia/min/use-object-url)](https://bundlephobia.com/result?p=use-object-url)

[![Library minified + gzipped size](https://badgen.net/bundlephobia/minzip/use-object-url)](https://bundlephobia.com/result?p=use-object-url)

React Hook that receives an instance of `File`, `Blob` or `MediaSource` and creates an URL representing it. It releases URL when component unmount or parameter changes.

```js

import useObjectURL from 'use-object-url';

const DownloadFileLink = ({ file, filename }) => {

  const { objectURL } = useObjectURL(file);

  return (

    

      Download

    

  );

};

```

## Installation

This library is published in the NPM registry and can be installed using any compatible package manager.

```sh

npm install use-object-url --save

# For Yarn, use the command below.

yarn add use-object-url

```

### Installation from CDN

This module has an UMD bundle available through JSDelivr and Unpkg CDNs.

```html

  function PreviewImage(props) {

    // UMD module is exposed through the "useObjectURL" function.

    var { objectURL } = useObjectURL(props.uploadedImage);

    return React.createElement('img', {

      src: objectURL,

      alt: 'Uploaded image',

      title: 'Preview of uploaded image.'

    });

  }

```

## Documentation

[Documentation generated from source files by Typedoc](./docs/README.md).

## License

Released under [MIT License](./LICENSE).