Question

我在react.js上有一个webapp bulid！有很多组件！所以我想给其他网站一些服务！

其他网站应包含来自我的webapp的js文件！例如：

<script type="text/javascript" src="https://mywebsite/script.js"></script>
//here am calling buttons from my js file
<script type="text/javascript">
    buttons.render("root");
</script>

，我基于bulid的应用程序应渲染按钮！

在普通js中，它将是这样

class buttons{
  constructor() {

  }
  render (id){
    document.getElementById(id).innerHTML = "here is buttons";
  }
}

buttons= new buttons();

但是我不知道我应该如何在react中做到这一点，我想用react做到这一点，因为我有一些逻辑要做！

Answer 1

您可以利用ReactDOM.render并将其公开为组件的全局API。

ReactDOM.render在接收新道具时将重新渲染组件这一事实在这里可以有很大帮助。

window.MyComponent = {
    mount: (props, container) => {
        ReactDOM.render(<MyComponent {...props} />, container);
    },
    unmount: (container) => {
        ReactDOM.unmountComponentAtNode(container);
    }
}

您的使用者然后可以使用此API来安装或更新和卸载组件

我在on my blog上对此进行了详细介绍，希望对您有所帮助。

如何将组件呈现给另一个Web应用程序

1 个答案: