Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/rwson/bind-with-arguments
easily bind events excute context and dynamic arguments in React
https://github.com/rwson/bind-with-arguments
arguments async-await autobind callback click context react
Last synced: 2 months ago
JSON representation
easily bind events excute context and dynamic arguments in React
- Host: GitHub
- URL: https://github.com/rwson/bind-with-arguments
- Owner: rwson
- Created: 2019-09-28T05:12:18.000Z (about 5 years ago)
- Default Branch: master
- Last Pushed: 2019-09-29T02:11:41.000Z (about 5 years ago)
- Last Synced: 2024-10-01T20:30:51.630Z (3 months ago)
- Topics: arguments, async-await, autobind, callback, click, context, react
- Language: JavaScript
- Homepage:
- Size: 3.91 KB
- Stars: 4
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## bind-with-arguments
彻底解决`React`事件绑定中`this`和参数的问题
### usage
```powershell
npm install bind-with-arguments --save
```
```jsx
import React, { Component } from 'react';
import bindWithArguments from 'bind-with-arguments';
class Comp extends Component {
async loadDdetail(id) {
// fetch
}
// 异步函数并且有参数
@bindWithArguments
async asyncParams(id) {
const detail = await this.loadDdetail(id);
// ...
}
// 异步函数并且无参数
@bindWithArguments
async asyncNoParams() {
// fetch
this.setState({
xxx: 'xxx'
});
}
// 同步函数并且有参数
@bindWithArguments
syncParams(id, name) {
if (id && name) {
this.setState({
xxx: 'xxxx'
});
}
}
// 同步函数并且有参数
@bindWithArguments
syncNoParams() {
const { yyy } = this.state;
if (yyy === 'zzz') {
this.setState({
xxx: 'xxxx'
});
}
}
render() {
const { list } = this.state;
return (
{
list.map((row) => {
return (
异步函数并且有参数
同步函数并且有参数
);
})
}
异步函数并且无参数
同步函数并且有参数
)
}
}
```