react-fakeimg
TypeScript icon, indicating that this package has built-in type declarations

2.0.2 • Public • Published

React Fakeimg

Need fake image for your mockup ? react-fakeimg will create for you a fake image thanks to canvas. There is no HTTP Requests which means internet connection is not required.

Install in your project

via npm

npm install --save react-fakeimg

via yarn

yarn add react-fakeimg

How to use

Import ES6

import FakeImg from 'react-fakeimg';

Simple example

<FakeImg
  alt="example"
  width={500}
  height={200}
/>

Text example

<FakeImg
  alt="example"
  width={500}
  height={200}
  text="Bonjour!"
/>

Change color example

<FakeImg
  alt="example"
  width={500}
  height={200}
  text="New color"
  bgColor="#005cc5"
  fontColor="#ffffff"
/>

API

Attributes list

Properties type Required default Description
alt string alt attribute is require in HTML5 for img tag
bgColor string #c19d67 Background colors
className string Add class attribute
fontColor string #3a2306 Font color
height Number Image height
id string #id
text string text to replace "width x height"
style object If you want to add style to the image
width Number Image width

Events list

Name type Parameters Required Description
onMount func none Called when the component did mount
onClick func none Called when click on the component
onMouseEnter func none Called when mouse enter the component
onMouseLeave func none Called when mouse leave the component
onUnMount func none Called when the component will unMount

Versions

Current Tags

VersionDownloads (Last 7 Days)Tag
2.0.21latest

Version History

VersionDownloads (Last 7 Days)Published
2.0.21
2.0.10
2.0.00
1.0.110
1.0.11
1.0.00
0.1.511
0.1.50
0.1.40
0.1.30
0.1.260
0.1.250
0.1.240
0.1.230
0.1.220
0.1.210
0.1.20
0.1.10
0.1.01

Package Sidebar

Install

npm i react-fakeimg

Weekly Downloads

4

Version

2.0.2

License

MIT

Unpacked Size

12.2 kB

Total Files

9

Last publish

Collaborators

  • huuduc