小编msh*_*eer的帖子

我在上下文中有语言设置,如下所示

class LanguageProvider extends Component {
  static childContextTypes = {
    langConfig: PropTypes.object,
  };

  getChildContext() {
    return { langConfig: 'en' };
  }

  render() {
    return this.props.children;
  }
}

export default LanguageProvider;

我的应用程序代码如下所示

<LanguageProvider>
  <App>
    <MyPage />
  </App>
</LanguageProvider>

我的页面有一个用于切换语言的组件

<MyPage>
  <LanguageSwitcher/>
</MyPage>

LanguageSwitcher 在此MyPage需要更新上下文以将语言更改为'jp',如下所示

class LanguageSwitcher extends Component {
  static contextTypes = {
    langConfig: PropTypes.object,
  };

  updateLanguage() {
    //Here I need to update the langConfig to 'jp' 
  }

  render() {
    return <button onClick={this.updateLanguage}>Change Language</button>;
  }
}

export default LanguageSwitcher; …

我已经为现有的Javasript-React项目实现了一组新的ESLint规则,需要修复大约7000个lint错误.是否有任何解决方案可用于自动修复或自动更正Linting规则,如下所示

  ?  18:47  A space is required before '}'    object-curly-spacing
  ?  19:10  A space is required after '{'     object-curly-spacing
  ?  21:14  Missing trailing comma            comma-dangle
  ?  129:9  Expected newline before return statement  newline-before-return
  ?  133:2  Missing semicolon                 semi

这是ES5中的代码,其中jsx被写入单独的文件中

import React from 'react';
import Template from './template.jsx';

const DetailElement = React.createClass({
  render: Template
});

export default DetailElement;
enter code here

template.jsx文件将是这样的

import React from 'react';

const render = function() {

    return (
      <div>Hello World</div>
    );
};

export default render;

如何使用ES6类编写相同的内容？或者可以使用任何其他解决方案进行此分离？

我有这样的ES6代码

import React, {Component} from 'react';
import Template from './template.jsx';

export default DetailElement extends Component {
   componentDidMount() {
    // some code
  }
};
DetailElement.prototype.render = Template;

是的,这是有效的.