React.js - ReactDOM.render или можете использовать встроенный?

Question

Я начал разработку в REACT и получил несколько небольших запросов о том, как использовать его в строке.

У меня есть, например, следующий фрагмент кода.

ReactDOM.render(
 
     <RitualPromoCode url="/Home/ValidatePromoCode" code="Bongo" location="1" package="17" />, 
 
     document.getElementById('promo-code') 
 
    );

однако при использовании выше, используя его в моей странице MVC это раздражает ... я хотел бы иметь возможность в пределах страницы HTML использовать новый «тег» встроенный ... например

 <RitualPromoCode url="/Home/ValidatePromoCode" code="Bongo" location="1" package="17" />

Как я идти об этом?

На другой ноте. Я хочу использовать несколько компонентов в разных частях моей страницы, но не хочу писать один ОГРОМНЫЙ компонент, чтобы использовать их все вместе. Как я могу получить один компонент для обновления/изменения свойств другого на той же странице?

Thanks

Answer 1

Вы можете назвать рендер в одном месте. Просто создайте «главный» компонент, который будет содержать все остальные.

ReactDOM.render(
    <App />, 
    document.getElementById('promo-code') 
); 

class App extends Component { 
    render() { 
    return (
    <div> 
     <RitualPromoCode url="/Home/ValidatePromoCode" code="Bongo" location="1" package="17" /> 
     <SomeOtherComponent /> 
     <MoreComponent /> 
     <MyComponent /> 
    </div> 
    ); 
    } 
}