Question

在我的班上，eslint正在抱怨＆＃34;期待＆＃39;这个＆＃39;由类方法＆get; getUrlParams＆＃39;

使用

这是我的班级：

class PostSearch extends React.Component {
  constructor(props) {
    super(props);
    this.getSearchResults();
  }

  getUrlParams(queryString) {
    const hashes = queryString.slice(queryString.indexOf('?') + 1).split('&');
    const params = {};

    hashes.forEach((hash) => {
      const [key, val] = hash.split('=');
      params[key] = decodeURIComponent(val);
    });

    return params;
  }

  getSearchResults() {
    const { terms, category } = this.getUrlParams(this.props.location.search);
    this.props.dispatch(Actions.fetchPostsSearchResults(terms, category));
  }

  render() {
    return (
      <div>
        <HorizontalLine />
        <div className="container">
          <Col md={9} xs={12}>
            <h1 className="aboutHeader">Test</h1>
          </Col>
          <Col md={3} xs={12}>
            <SideBar />
          </Col>
        </div>
      </div>
    );
  }
}

解决此问题或重构此组件的最佳方法是什么？

Answer 1

你应该将函数绑定到this，因为ESLint错误说"Expected 'this' to be used by class method 'getUrlParams'

getUrlParams = (queryString) => { .... }

因为您在渲染过程中没有使用getUrlParams（例如onClick()）所以上面的技术很好，我们可以称之为＆＃34;在类属性中使用箭头函数＆＃34;。< / p>

还有其他绑定方式：

this.getUrlParams=this.getUrlParams.bind(this)

绑定
渲染中的箭头函数，例如onClick={()=>this.getUrlParams()}，假设函数没有参数。
和React.createClass没有意义：）

Answer 2

这是一个ESlint规则，请参阅class-methods-use-this。

您可以提取方法getUrlParams并将其放入帮助，或将其设为static。

您还可以在方法中移动this.props.location.search，因此在没有参数的情况下调用this.getUrlParams()方法，因为您似乎只使用了一次。

因此，这可能看起来像：

getUrlParams() {
    const queryString = this.props.location.search;
    ...
    return params;
  }

最后一个选项是禁用此ESlint规则。

Answer 3

getUrlParams = queryString => { ... }

Answer 4

另一个用例可能是。

假设你有一个名为 handlePasswordKeyUp 的方法。功能的主体可以这样看。

handlePasswordKeyUp() {
  console.log('yes')
}

上面的代码会触发该错误。所以至少在身体功能

中使用 this

handlePasswordKeyUp(){
   this.setState({someState: someValue})
}

Answer 5

我的解决方案是在类之外使用此函数并将此函数绑定到类。

HTTP/1.1 200 

a: 268409219

Answer 6

对此规则的可能破解。

getMoviesByID(){
  //Add a reference to this in your function.
  this.funcName = 'getMoviesByID';
}

期待＆＃39;这个＆＃39;由类方法使用

6 个答案: