https://github.com/gregros/react-lifecycle-decorators

A new way of attaching React lifecycle hooks.
https://github.com/gregros/react-lifecycle-decorators

decorators es7 javascript lifecycle-events react-lifecycle-hooks reactjs typescript ui

Last synced: 24 days ago
JSON representation

A new way of attaching React lifecycle hooks.

• Host: GitHub
• URL: https://github.com/gregros/react-lifecycle-decorators
• Owner: GregRos
• Created: 2016-10-15T15:02:59.000Z (over 8 years ago)
• Default Branch: master
• Last Pushed: 2016-10-15T18:00:18.000Z (over 8 years ago)
• Last Synced: 2024-10-29T15:06:13.487Z (3 months ago)
• Topics: decorators, es7, javascript, lifecycle-events, react-lifecycle-hooks, reactjs, typescript, ui
• Language: TypeScript
• Size: 53.7 KB
• Stars: 0
• Watchers: 3
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# React Lifecycle Decorators

This library introduces a set of ES7/TypeScript decorators that offer you a new way to set up React lifecycle hooks.

Here is how it looks like:

	import {Life} from 'react-lifecycle-es7-decorators';

	class MyComponent extends React.Component {

		@Life.didUpdate

		@Life.didMount

		invalidate() {

			//code to execute on componentDidUpdate and componentDidMount

		}

	}

	class DerivedComponent extends MyComponent {

		@Life.didUpdate

		afterUpdate() {

			//code to execute on componentDidUpdate

		}

	}

The decorators add functions to the relevant lifecycle methods in a way that doesn't interfere with previous hooks.

Also, when using an IDE with TypeScript tooling, the `Life` namespace reminds you of the available lifecycle hooks and their signatures.