ReactJS использует веб-компонент в JavaScript

Question

Я могу найти много документации для использования WebComponent с использованием JSX в React. Ну, это довольно прямолинейно ...

Но как использовать веб-компонент в JavaScript с помощью ReactJS ??

render: function(){ 
    React.DOM.div {}, 
    MyWebComponent {}, "hello" 

Где MyWebComponent является компонентом, с которым я хочу работать.

Answer 1

Как указано in the official react site вы должны быть в состоянии использовать веб-компоненты с реагировать

render: function(){ 
    return <div><MyWebComponent>hello</MyWebComponent></div>; 
} 

здесь тот же пример в чистом JS

render: function render() { 
    return React.createElement(
    "div", 
    null, 
    React.createElement(
     MyWebComponent, 
     null, 
     "hello" 
    ) 
); 
} 

Answer 2

В JavaScript react.createElement принимает элемент или componant как первый аргумент, стили в качестве второго аргумента, дети как третий аграмент.

  import customComponent from 'my-custom-component'; 
      var child = React.createElement(customComponent, null, 'Text Content'); 
      var Element = React.createElement('div', { className: 'my-class' }, child); 


      render: function(){ 
       {Element} 
      } 

или вы можете сделать это

... 
import customComponent from 'my-custom-component'; 
... 

render: function(){ 
     {React.createElement('div', { className: 'my-class' },customComponent);} 
}