React 360 render to location from component

У меня есть два компонента в моем шаблоне, один из которых я хотел бы монтировать только тогда, когда метод вызывается из другого компонента.

Как я мог это сделать?

Вот мой шаблон:

import {ReactInstance} from 'react-360-web';

function init(bundle, parent, options = {}) {
  ...
  // Render 1
  r360.renderToSurface(
    r360.createRoot('Component1'),
    r360.getDefaultSurface()
  );

  //I WOULD LIKE TO MOUNT THIS COMPONENT LATER!
  r360.renderToLocation(
    r360.createRoot('Component2'),
    r360.getDefaultLocation(),
  );
}

window.React360 = {init};

Вот мой компонент:

export default class Component1 extends React.Component {
  constructor(props) {
    super(props)
  }

  mountNewComponent() {
    //HOW TO MOUNT COMPONENT2 FROM HERE??
  }
  ..
}

reactjs react-360
person bear    schedule 09.05.2018    source источник

Ответы (1)


arrow_upward
0
arrow_downward

клиент.js:

function init(bundle, parent, options = {}) {
  ...
  r360.runtime.executor._worker.addEventListener('message', (e) => onMessage(e, r360));
}

function onMessage(e, r360) {
  if(e.data.type === 'newComponent') {
    //TODO mount hier
  }
}

в компоненте:

mountNewComponent() {    
  postMessage({ type: "newComponent"});
}
person Jan F.    schedule 09.05.2018