Динамический рендеринг компонента на основе реквизита

Question

Динамический рендеринг компонента на основе реквизита

В bootstrap 4 у вас есть встроенный CSS-центр текста, поэтому вы можете использовать его в любом div-классе для центрирования содержимого

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">

<div class="card text-white bg-info mx-auto text-center" style="max-width: 18rem;">
    <div class="card-header">Header</div>
        <div class="card-body">
            <h5 class="card-title text-center">Info card title</h5>
            <p class="card-text">Some quick example text to build on the card title and make up the bulk of the     card's content.</p>
        </div>
    </div>
</div>

0

reactjs react-native

задан Reem 19 January 2019 в 11:03

2 ответа

Другие вопросы по тегам:

reactjs react-native

Похожие вопросы:

score 0 · Answer 1

Я создал отдельный файл JS, импортирующий все внешние компоненты, а затем динамически отправлял имя компонента в подпорках, чтобы выбрать его из этого файла, также динамическую загрузку. не будет работать, когда значение, переданное в require, вычисляется во время выполнения.

score 0 · Answer 2

Это не сработает, потому что упаковщик уже упаковал файлы. По той же причине, по которой вы не можете динамически требовать.

Вам необходимо изменить логику, чтобы она, вероятно, принимала строку, а затем иметь фабрику для динамической визуализации компонента. Примерно так:

<Parent child='one'/>

render(){

 let Component = One;

switch(this.props.child){
   case: 'one':
      Component: One; break;
    case: 'two':
     Component: Two; break;
}

return <Component/>

}