{"_id":"react-autobind","_rev":"3883557","name":"react-autobind","description":"Automatically binds methods defined within a component's Class to the current object's lexical `this` instance (similarly to the default behavior of React.createClass).","dist-tags":{"latest":"1.0.6"},"maintainers":[{"name":"cassiozen","email":"cassiozen@gmail.com"}],"time":{"modified":"2025-09-01T01:01:14.000Z","created":"2016-01-23T09:02:19.312Z","1.0.6":"2016-01-23T09:37:24.919Z","1.0.5":"2016-01-23T09:07:31.473Z","1.0.0":"2016-01-23T09:02:19.312Z"},"users":{"artivilla":true,"modao":true,"juandc":true,"pldrake26":true,"nbcuniversalpaint":true,"lvnam96":true},"author":{"name":"Cássio M. Antonio"},"repository":{"type":"git","url":"git://github.com/cassiozen/React-autobind.git"},"versions":{"1.0.6":{"name":"react-autobind","version":"1.0.6","description":"Automatically binds methods defined within a component's Class to the current object's lexical `this` instance (similarly to the default behavior of React.createClass).","main":"index.js","scripts":{"test":"mocha --require babel-core/register"},"author":{"name":"Cássio M. Antonio"},"license":"MIT","repository":{"type":"git","url":"git://github.com/cassiozen/React-autobind.git"},"devDependencies":{"babel-core":"~6.0.*","babel-loader":"~6.0.*","babel-preset-es2015":"~6.0.*","babel-preset-react":"~6.0.*","mocha":"^2.3.0"},"gitHead":"478dc85f17bbbafec7be11af55a29be4aa5954bb","bugs":{"url":"https://github.com/cassiozen/React-autobind/issues"},"homepage":"https://github.com/cassiozen/React-autobind#readme","_id":"react-autobind@1.0.6","_shasum":"936bb58edf6b89b619c50f82f0e617159fdfd4f1","_from":".","_npmVersion":"3.3.10","_nodeVersion":"5.0.0","_npmUser":{"name":"cassiozen","email":"cassiozen@gmail.com"},"dist":{"shasum":"936bb58edf6b89b619c50f82f0e617159fdfd4f1","size":6099,"noattachment":false,"key":"/react-autobind/-/react-autobind-1.0.6.tgz","tarball":"http://registry.cnpm.dingdandao.com/react-autobind/download/react-autobind-1.0.6.tgz"},"maintainers":[{"name":"cassiozen","email":"cassiozen@gmail.com"}],"directories":{},"publish_time":1453541844919,"_hasShrinkwrap":false,"_cnpm_publish_time":1453541844919,"_cnpmcore_publish_time":"2021-12-16T19:43:18.589Z"},"1.0.5":{"name":"react-autobind","version":"1.0.5","description":"Automatically binds methods defined within a component's Class to the current object's lexical `this` instance (similarly to the default behavior of React.createClass).","main":"index.js","scripts":{"test":"mocha --require babel-core/register"},"author":{"name":"Cássio M. Antonio"},"license":"MIT","repository":{"type":"git","url":"git://github.com/cassiozen/React-autobind.git"},"devDependencies":{"babel-core":"~6.0.*","babel-loader":"~6.0.*","babel-preset-es2015":"~6.0.*","babel-preset-react":"~6.0.*","mocha":"^2.3.0"},"gitHead":"56affa0b90f3a0a286ee11e2c1ee5ec03a243983","bugs":{"url":"https://github.com/cassiozen/React-autobind/issues"},"homepage":"https://github.com/cassiozen/React-autobind#readme","_id":"react-autobind@1.0.5","_shasum":"3a64b16cd08521251114e43cef7a90a2dbda86b1","_from":".","_npmVersion":"3.3.10","_nodeVersion":"5.0.0","_npmUser":{"name":"cassiozen","email":"cassiozen@gmail.com"},"dist":{"shasum":"3a64b16cd08521251114e43cef7a90a2dbda86b1","size":6059,"noattachment":false,"key":"/react-autobind/-/react-autobind-1.0.5.tgz","tarball":"http://registry.cnpm.dingdandao.com/react-autobind/download/react-autobind-1.0.5.tgz"},"maintainers":[{"name":"cassiozen","email":"cassiozen@gmail.com"}],"directories":{},"publish_time":1453540051473,"_hasShrinkwrap":false,"_cnpm_publish_time":1453540051473,"_cnpmcore_publish_time":"2021-12-16T19:43:19.072Z"},"1.0.0":{"name":"react-autobind","version":"1.0.0","description":"Automatically binds methods defined within a component's Class to the current object's lexical `this` instance (similarly to the default behavior of React.createClass).","main":"index.js","scripts":{"test":"mocha --require babel-core/register"},"author":{"name":"Cássio M. Antonio"},"license":"MIT","repository":{"type":"git","url":"git://github.com/cassiozen/React-autobind.git"},"devDependencies":{"babel-core":"~6.0.*","babel-loader":"~6.0.*","babel-preset-es2015":"~6.0.*","babel-preset-react":"~6.0.*","mocha":"^2.3.0"},"gitHead":"8a9e354bd19f279d5561ac4851bce67507bbf515","bugs":{"url":"https://github.com/cassiozen/React-autobind/issues"},"homepage":"https://github.com/cassiozen/React-autobind#readme","_id":"react-autobind@1.0.0","_shasum":"ef23c8621a50380c9a067f8d1b8920acf9ff0ac4","_from":".","_npmVersion":"3.3.10","_nodeVersion":"5.0.0","_npmUser":{"name":"cassiozen","email":"cassiozen@gmail.com"},"dist":{"shasum":"ef23c8621a50380c9a067f8d1b8920acf9ff0ac4","size":6059,"noattachment":false,"key":"/react-autobind/-/react-autobind-1.0.0.tgz","tarball":"http://registry.cnpm.dingdandao.com/react-autobind/download/react-autobind-1.0.0.tgz"},"maintainers":[{"name":"cassiozen","email":"cassiozen@gmail.com"}],"directories":{},"publish_time":1453539739312,"_hasShrinkwrap":false,"_cnpm_publish_time":1453539739312,"_cnpmcore_publish_time":"2021-12-16T19:43:19.273Z"}},"readme":"React Class autoBind\n=====================\n\nAutomatically binds methods defined within a component's Class to the current object's lexical `this` instance (similarly to the default behavior of React.createClass).\n\n\n### Description\n\nReact 0.13 introduced the possibility to define components using plain JavaScript ES6 classes. But differently from the traditional React.createClass, user defined methods in a ES6 class are not automatically bound.\n\nAutobind is an utility function that can be called from the class constructor to bind the class methods to the component instance.\n\n### Installation\n\nTo install the stable version:\n\n```\nnpm install --save react-autobind\n```\n\n### Usage\nYou will generally call autoBind from the class constructor, passing the 'this' context:\n\n```javascript\nimport autoBind from 'react-autobind';\n\nconstructor() {\n  super();\n  autoBind(this);\n}\n```\n\nAutobind is smart enough to avoid binding React related methods (such as render and lifecycle hooks).\n\nYou can also explicitly specify which methods you want to bind:\n\n```javascript\nimport autoBind from 'react-autobind';\n\nconstructor() {\n  super();\n  autoBind(this, 'myMethod1', 'myMethod2');\n}\n```\n\n### Example\n\n```javascript\nimport React from 'react';\nimport {render} from 'react-dom';\nimport autoBind from 'react-autobind';\n\nclass App extends React.Component {\n\n  constructor() {\n    super();\n    this.state = {\n      clickCounter: 0\n    }\n    autoBind(this);\n  }\n\n  componentDidMount() {\n    console.log(\"Component is mounted\");\n  }\n\n  increment() {\n    this.setState({\n      clickCounter: this.state.clickCounter + 1\n    });\n  }\n\n  render(){\n    return (\n      <div>\n        <h1>Number of clicks: {this.state.clickCounter}</h1>\n        <button onClick={this.increment}>Increment Counter</button>\n      </div>\n    );\n  }\n}\n\nrender(<App />, document.getElementById('root'));\n\n```\n","_attachments":{},"homepage":"https://github.com/cassiozen/React-autobind#readme","bugs":{"url":"https://github.com/cassiozen/React-autobind/issues"},"license":"MIT"}