Dlaczego reagujesz na usuwanie moich nazw klas?

Question

Uczę się Reactjs i renderuję prostą stronę z niektórymi komponentami. Jednym z tych elementów jest taka:

class Header extends React.Component { 
    render(){ 
     return (
      <header> 
       <div class="container"> 
        <Logo /> 
        <Navigation /> 
       </div> 
      </header> 
     ); 
    } 
} 

export default Header 

Używam bootstrap css chcę div wewnątrz nagłówka aby wykorzystać style container, jak zawsze, po kompilacji, klasa znika.

Czy istnieje sposób na wymuszenie klasy atrybutów w komponentach?

Answer 1

Należy użyć className atrybut zamiast class np:

class Header extends React.Component { 
    render(){ 
     return (
      <header> 
       <div className="container"> 
        <Logo /> 
        <Navigation /> 
       </div> 
      </header> 
     ); 
    } 
} 

Sprawdź Supported Attributes w dokumentacji.

Wszystkie atrybuty wielbłądów obudowane i atrybuty class i for są className i htmlFor, odpowiednio, w celu dostosowania do specyfikacji DOM API.

Mam nadzieję, że to pomoże.