Skip to content
This repository has been archived by the owner on Jun 17, 2019. It is now read-only.

jomaxx/react-create-side-effect

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

react-create-side-effect

Declarative side effects!

Install

yarn add react-create-side-effect react

ReactCreateSideEffect

ReactCreateSideEffect~createSideEffect(fn) ⇒ ReactComponent

Creates a component that executes a side effect when component mounts. Return a function to handle any clean up when the component unmounts.

Kind: inner method of ReactCreateSideEffect

Param Type
fn function

Example

import React from "react";
import ReactDOM from "react-dom";
import { createSideEffect } from "react-create-side-effect";

const LocationRedirect = createSideEffect(props => {
  window.location.replace(props.to);
});

ReactDOM.render(
  <LocationRedirect to="/login" />,
  document.getElementById("root")
);

Example (cleaning up)

import React from "react";
import ReactDOM from "react-dom";
import { createSideEffect } from "react-create-side-effect";

const Body = createSideEffect(props => {
  document.body.classList.add(props.className);
  return () => document.body.classList.remove(props.className);
});

ReactDOM.render(<Body className="mounted" />, document.getElementById("root"));