Реагировать reposinveness + бутстрап

Question

Реакция реагирования Я просто хотел знать, как реагирование на реакцию возможно?

Существуют различные способы достижения отзывчивости, такие как

css-grid bootstrap-grid response-bootstrap

Могут ли некоторые дать мне знать, какой предпочтительный способ заставить реагировать на реакцию?

С уважением,

Answer 1

Просто используйте простой JS, в этом прелесть React. Я лично делаю это:

class Responsive extends Component {
  state = { isMobile: false };

  componentDidMount() {
    // use css media quries
    this.isMobile = window.matchMedia("(max-width: 767px)");

    // test on first run
    this.handleIsMobile({ matches: this.isMobile.matches });

    // listen to changes after first run
    this.isMobile.addListener(this.handleIsMobile);
  }

  componentWillUnmount() {
    // stop listening when unmounted
    this.isMobile.removeListener(this.handleIsMobile);
  }

  handleIsMobile = ({ matches }) => this.setState({ isMobile: matches });

  render() {
    if (this.state.isMobile) return <div>MOBILE</div>;

    return <div>DESKTOP</div>;
  }
}

Answer 2

Сначала отошлите это, Загрузочный веб-пакет

Это один из способов использования начальной загрузки в проектах реагировать.

Преимущество этого в том, что вы получаете доступ к последней загрузочной версии CSS.

Недостатком использования этого является его сложность в использовании плагинов jquery в реактивах. Hovewr, если вас интересует только css, то он идеален.

Используя это, вы можете напрямую использовать классы начальной загрузки из документации и получить больше контроля. Просто используйте className вместо class

Если вы хотите простую настройку, тогда вы можете использовать responsestrap link

Другие фреймворки включают реакцию-бутстрап ссылка