时间戳

首页 > 解决方案 > 聚合物 3 相对路径

javascript - 聚合物 3 相对路径

问题描述

我想将聚合物元素从聚合物 2 迁移到聚合物 3。

聚合物元素使用带有 .svg 文件的文件夹的相对路径。

const url = this.resolveUrl('./icons/' + this.icon + '.svg');

问题是旧的组件文件是一个 .html 文件，所以如果你包含它，脚本部分中的相对路径总是相同的。

现在组件文件是一个 javascript 文件，因此相对路径 (.) 是包含 javascript 文件的文件的路径。


标签： javascriptsvgpolymerrelative-path

解决方案

要解决此问题，请将以下 getter 方法添加到您的元素类：

static get importMeta() { 
  return import.meta; 
}

加载元素时，上面的 getter 会分配importPath元素的属性。resolveUrl现在将基于importPath而不是基于主文档来解析相对路径。

顺便说一句，您还可以importPath在数据绑定中使用，如下所示：

<img src$="[[importPath]]/icons/[[icon]].png">

有关为什么 Polymer 默认不重写模板中的 URL 的更多信息，请参阅有关 DOM 模板的文档。

（顺便说一句，看起来importPath该页面上的内容需要更新。我提出了一个问题，用我上面概述的最新信息更新网站。）

希望有帮助

推荐阅读