首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

在箭头函数(React)中使用时,Lodash 'get‘不起作用

在箭头函数(React)中使用时,Lodash 'get'不起作用的原因是箭头函数没有自己的this绑定,它会继承外部作用域的this值。而Lodash的'get'函数依赖于this的指向来获取对象的属性值,因此在箭头函数中使用'get'函数时,this指向的是外部作用域的this,而不是当前组件的实例。

解决这个问题的方法是使用普通函数而不是箭头函数来定义React组件的方法。普通函数会有自己的this绑定,可以正确地使用Lodash的'get'函数。

以下是一个示例代码:

代码语言:txt
复制
import React from 'react';
import _ from 'lodash';

class MyComponent extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      data: {
        foo: {
          bar: 'baz'
        }
      }
    };
  }

  handleClick() {
    const value = _.get(this.state.data, 'foo.bar');
    console.log(value);
  }

  render() {
    return (
      <button onClick={this.handleClick.bind(this)}>Click me</button>
    );
  }
}

export default MyComponent;

在上面的示例中,我们使用普通函数来定义了handleClick方法,并在render方法中使用bind方法将当前组件实例的this绑定到handleClick方法中。这样就能正确地使用Lodash的'get'函数来获取对象的属性值了。

推荐的腾讯云相关产品:腾讯云函数(云函数是一种事件驱动的无服务器计算服务,可以帮助您更轻松地构建和运行云端应用程序。)。

腾讯云函数产品介绍链接地址:https://cloud.tencent.com/product/scf

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

  • 领券