Как вызвать реакцию конкретного компонента, присутствующего в ReactDOM.render - PullRequest
Новая
       21

Как вызвать реакцию конкретного компонента, присутствующего в ReactDOM.render

0 голосов
/ 25 декабря 2018

У меня есть 2 компонента для представления в одном div myProject-init.js, по 1 за раз.Но оба они называются параллельными.

myProject-init.js file: 

ReactDOM.render(
<div>
    <component1>in component1</component1>
    <component2>in component2</component2>
</div>

Я хочу вызывать component1 независимо от другого проекта, могу ли я сделать то же самое?если да то как?

1 Ответ

0 голосов
/ 25 декабря 2018

Что я понял, так это то, что у вас есть 2 компонента, и вы хотите визуализировать 1 компонент за один раз.так что лучше использовать условный рендеринг и рендерить только один компонент, используя ReactDOM.render()

, например 

    import React from 'react'
    import ReactDOM from 'react-dom';
    import Component1 from 'somewhere'
    import Component2 from 'somewhere'

    let renderedComponent;

    if (certain condition to meet) {
      renderedComponent = <Component1/>
    } else { 
       renderedComponent = <Component2/>
    }
    ReactDOM.render(renderedComponent, document.getElementById('root'));

Другой способ 

   // check condition here and assign its value 
   // eg: let renderComponent1 = ( condition to check )
    let renderComponent1 = true 
    let renderComponent2 = false 

 ReactDOM.render(
    <div> 
     {renderedComponent1 && <Component1 />}
     {renderedComponent2 && <Component2 />}
   </div>
, document.getElementById('root'));

Это будет отображать только <Component1 /> и если вы хотите визуализировать только <Component2/>, тогда установите renderComponent2 в true и renderComponent1 в false.

Установка true для переменных renderComponent1 и renderComponent2 будет отображать оба компонента, а установка false не будет отображать какой-либо компонент

Надеюсь, это то, что вам нужно.

...