Question

我尝试以ES2015风格开发简单的web组件。组件my-action嵌套在组件my-action-bar中。

在Github中的版本中，在我的客户端页面（demo-action-bar.html）中，我“导入”了两个组件。我只想在我的html客户端页面中导入my-action-bar，但我不知道如何将my-action“导入”my-action-bar组件......

Answer 1

您可以使用 HTML Imports 来加载Web组件依赖项：

在 my-action.html ：

<script src="my-action.js"></script>

在 my-action-bar.html ：

<link rel="import" href="my-action.html"> 
<script src="my-action-bar.js></script>

在 demo-action-bar.html ：

中

<link rel="import" href="my-action-bar.html">
...
<my-action-bar></my-action-bar>

或者，您可以使用标准XMLHttpRequest或fetch：

在 my-action-bar.js ：

    var xhr = new XMLHttpRequest
    xhr.open( 'GET', 'my-action.js' )
    xhr.onload = function ()
    {
        var script = document.createElement( 'script' )
        script.innerHTML = xhr.response
        document.head.appendChild( script )
    }
    xhr.send()

或者您可以使用第三个pary模块加载器，如RequireJS。

嵌套Web组件“ES2015样式”，如何从外部组件导入嵌套组件

1 个答案: