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

Я хочу передать путь компонента от родительского компонента реакции к дочернему компоненту реакции, и этот дочерний компонент должен импортировать компонент, когда реквизиты будут готовы, но динамический импорт зависит от того, что переданное значение должно быть строкой, а не значением для разрешения в время выполнения, что-нибудь может помочь мне в

пример

<Parent childComponentPath={'../foo/bar'}/>
  cont child = require(this.props.childComponentPath)
  
  <Child/>

Изменить: я пробовал, System.import не работает


react-native reactjs dynamic-import
person Reem    schedule 19.01.2019    source источник
comment
Какой смысл это делать?   -  person Brian Le    schedule 19.01.2019
comment
я хочу динамически отображать компонент из файла json   -  person Reem    schedule 19.01.2019
comment
Все ли дети разные?   -  person Brian Le    schedule 19.01.2019
comment
да, они разные, у каждого есть тип для рендеринга разных компонентов   -  person Reem    schedule 19.01.2019
comment
Возможный дубликат, см. этот ответ   -  person Dor Shinar    schedule 19.01.2019
comment
Возможный дубликат имени импорта переменной ES6 в node.js?   -  person Patrick Hund    schedule 19.01.2019
comment
не решил мою проблему   -  person Reem    schedule 19.01.2019

Ответы (2)


arrow_upward
1
arrow_downward

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

Вам нужно будет изменить свою логику, чтобы, возможно, принять строку, а затем иметь фабрику для динамического рендеринга компонента. Что-то вроде этого:

<Parent child='one'/>

render(){

 let Component = One;

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

return <Component/>

}
person sfratini    schedule 20.01.2019

arrow_upward
0
arrow_downward

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

person Reem    schedule 26.01.2019