Блог

Я только что узнал о том, как dash создает свои собственные компоненты . Я также новичок в react. Обычно я предпочитаю писать компонент в react в классе. Я создал файл react, куда я поместил исходный код HTML-компонента dash. Компонент Div написан на function. Я хочу преобразовать этот компонент Div в класс. Вот что я делаю —

 import React from 'react';
import PropTypes from 'prop-types';
import {omit} from 'ramda';

class Div extends Component{

   render(){
     const props = this.props;
     const dataAttributes = {};
     if(props.loading_state amp;amp; props.loading_state.is_loading) {
          dataAttributes['data-dash-is-loading'] = true;
     }

     return (
        <div id = "scroll-div" className="scroll-bar"
            onClick={() => props.setProps({
                n_clicks: props.n_clicks   1,
                n_clicks_timestamp: Date.now()
            })}
           {...omit(['n_clicks', 'n_clicks_timestamp', 'loading_state', 'setProps'], props)}
        {...dataAttributes}
        >
           {props.children}

        </div>
    );
  }
};
Div.defaultProps = {
  n_clicks: 0,
  n_clicks_timestamp: -1,
};

Div.propTypes = {
     .......
};

export default Div;
  

Но это преобразование, которое я сделал в class, не работает. Что я делаю не так? Каким будет правильное преобразование компонента Div в класс?

Спасибо 🙂

Вы должны импортировать :-

 import React,{Component} from 'react';
  

Или в вы можете изменить объявление вашего класса как :-

 class Div extends React.Component{}