Skip to content

A cleaner way to bind methods. Written for React ES6

Notifications You must be signed in to change notification settings

juan-orca/bindmethods

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 
 
 

Repository files navigation

bindmethods

A cleaner way to bind methods. Written for React ES6

https://www.npmjs.com/package/bindmethods - Downloaded 85 times as of 4/14/2016

Installation

npm install bindmethods

Signature

function ([arrayOfStrings],this)

API

bindMethods is a function that accepts 2 parameters.

First Parameter - An array of strings that you wish to bind

Second Parameter - The 'this' keyword

Examples

When you are creating a new React ES6 Component, Why do this :

class ExampleComponent extends React.Component {
 constructor() {
  super();
  this.handleClick = this.handleClick.bind(this);
  this.handleUpdate = this.handleUpdate.bind(this);
  this.handleDelete = this.handleDelete.bind(this);
 }
 render() { 
  return <div onClick={this._handleClick}>Hello, world.</div>;
 }
 
 handleClick() {
  console.log("handleClick")
 }

 handleUpdate() {
  console.log("handleUpdate")
 }

 handleDelete() {
  console.log("handleDelete")
 }
}

When you can do this :

var bindMethods = require("bindmethods");
class ExampleComponent extends React.Component {
 constructor() {
  super();
  bindMethods([
    'handleClick',
    'handleUpdate',
    'handleDelete'
  ],this)
 }
 render() { 
  return <div onClick={this._handleClick}>Hello, world.</div>;
 }
 
 handleClick() {
  console.log("handleClick")
 }

 handleUpdate() {
  console.log("handleUpdate")
 }

 handleDelete() {
  console.log("handleDelete")
 }
}

To acheive the same result. Stop spending time writing boilerplate. Use bindmethods :)

About

A cleaner way to bind methods. Written for React ES6

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published