将一个静态函数调用到React ES6类中

Question

我有以下ReactJS类：

import React from 'react'

export class Content extends React.Component {

  static getValue(key) {
    return key
  }

  render() {
    let value = this.getValue(this.props.valueKey);
    return <span dangerouslySetInnerHTML={{__html: value}} />
  }
}

但是我有以下错误：

TypeError: this.getValue is not a function

我不明白。 这是调用静态函数的好方法吗？ 我认为反应是用静电做的，但我不知道是什么。

Answer 1

需要在类而不是实例上访问静态方法。 所以在你的情况下，使用：

Content.getValue()

但是，静态方法将无法访问this - 我不认为您希望该方法基于上面的代码示例是静态的。

更多： ES6中的静态成员

Answer 2

您可以在类中以this.constructor.getValue进行访问。

编辑：我在这里添加了一个JSFiddle。 我做的唯一改变是从构造函数添加函数调用并删除危险的setHTML - 如图所示，您可以从this.constructor访问getValue静态，并且工作得很好。