2015-07-28 2 views
4

Я использую react-fullstack как эшафот, чтобы начать мой проект.В чем разница между простым классом es6 и расширением React.Component

Я нахожу, что его примерный код очень отличается от официального документа-подтверждения.

Пример кода, как это:

@withStyles(styles) 
class Header { 

    render() { 
    return (
    /* simple JSX code */ 
    ); 
    } 
} 


function withStyles(styles) { 
    return (ComposedComponent) => class WithStyles { 

    static contextTypes = { 
     onInsertCss: PropTypes.func 
    }; 

    constructor() { 
     this.refCount = 0; 
     ComposedComponent.prototype.renderCss = function (css) { 
     let style; 
     if (ExecutionEnvironment.canUseDOM) { 
      if (this.styleId && (style = document.getElementById(this.styleId))) { 
      if ('textContent' in style) { 
       style.textContent = css; 
      } else { 
       style.styleSheet.cssText = css; 
      } 
      } else { 
      this.styleId = `dynamic-css-${count++}`; 
      style = document.createElement('style'); 
      style.setAttribute('id', this.styleId); 
      style.setAttribute('type', 'text/css'); 

      if ('textContent' in style) { 
       style.textContent = css; 
      } else { 
       style.styleSheet.cssText = css; 
      } 

      document.getElementsByTagName('head')[0].appendChild(style); 
      this.refCount++; 
      } 
     } else { 
      this.context.onInsertCss(css); 
     } 
     }.bind(this); 
    } 

    componentWillMount() { 
     /* some implement */ 
    } 

    componentWillUnmount() { 
     /* some implement */ 
    } 

    render() { 
     return <ComposedComponent {...this.props} />; 
    } 

    }; 
} 

Он даже не распространяется React.Component вообще, я не могу видеть его использовать наследование прототипа либо.

Но он работает, и каждый компонент может использоваться в качестве официального документа.

Означает ли это, если я реализую класс с помощью метода render, я реализую компонент React?

ответ

3

Означает ли это, если я реализую класс с помощью метода render, я реализую компонент React?

В значительной степени. React.Component предоставляет только методы setState и forceUpdate. Вам нужно наследовать только от React.Component, если они вам понадобятся.Редактировать: С введением элементов без состояния (функций) на самом деле требуется расширение React.Component, чтобы React мог отличать функции от конструкторов классов.

Смежные вопросы