faq-styling.md

id	title	permalink	layout	category
faq-styling	Stilləmə və CSS	docs/faq-styling.html	docs	FAQ

Komponentlərə CSS Klaslarını Necə Əlavə Edə Bilərəm? {#how-do-i-add-css-classes-to-components}

Klasları mətn formasında className propuna göndərin:

render() {
  return <span className="menu navigation-menu">Menyu</span>
}

Adətən, CSS klasları proplar və ya state-dən asılı olur:

render() {
  let className = 'menu';
  if (this.props.isActive) {
    className += ' menu-active';
  }
  return <span className={className}>Menyu</span>
}

Məsləhət

Əgər yuxarıdakı formalı kodu çox yazırsınızsa classnames paketi ilə bu kodu sadələşdirə bilərsiniz.

Eyni-sətrli Stillər İşlədə Bilərəm? {#can-i-use-inline-styles}

Bəli, stilləmək haqqında məlumat üçün bu sənədə baxın.

Eyni-sətrli Stillər Pisdir? {#are-inline-styles-bad}

CSS klasları eyni-sətrli stillərdən daha tez işləyir.

CSS-in-JS Nədir? {#what-is-css-in-js}

CSS-in kənar fayllarda tərtib edilməsi əvəzinə JavaScript-də tərtib edilməsi metodu "CSS-in-JS" adlanır. CSS-in-JS kitabxanalarının müqayisəsinə buradan baxın.

Nəzərə alın ki, bu funksionallıq React-in bir hissəsi deyil. Bu, 3-cü tərəfli kitabxanalar tərəfindən təmin edilir. React, stillərin necə işlənməsi haqqında heç bir fikir vermir. Əgər seçim edə bilmirsinizsə, başlanğıc nöqtəsi kimi stilləri ayrı *.css fayllarında yaradıb className ilə istinas edə bilərsiniz.

React-də Animasiya Edə Bilərəm? {#can-i-do-animations-in-react}

React ilə animasiya icra etmək mümkündür. React Transition Group, React Motion və ya React Spring kimi kitabxanalara baxın.