我有以下代码。
let myapp = this;
myref.on('value', function (snapshot) {
myapp.updateUsers();
});
我试图摆脱修复范围问题的代码。我可以将其转换为 ES6 箭头函数吗？
或者有没有办法访问 react root 应用程序？
class App extends Component {}
React - 箭头函数和 this 和作用域
IT技术
reactjs
scope
ecmascript-6
arrow-functions
2021-05-03 07:50:55
1个回答
当您在 a 内部class并使用箭头函数时，this将通过词法作用域将其引用绑定到实例，而不是像普通函数那样动态绑定。
因此，当您想在 中使用方法时，class您可以class使用this关键字引用该实例：
someFunction = () => {this.updateUsers()}
简单示例：
class App extends React.Component {
myfunc1 = (str) => {
console.log(str);
}
myFunc2 = () => {
this.myfunc1('hi func 2')
}
render() {
return (
<div>
<button onClick={this.myFunc2}>Click Me</button>
</div>
);
}
}
ReactDOM.render(<App />, document.getElementById("root"));<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<div id="root"></div>