javascript – 聚合物3相对路径

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

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

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

问题是旧组件文件是.html文件,因此如果包含它,脚本部分中的相对路径始终是相同的.
现在组件文件是一个javascript文件,因此相对路径(.)是包含javascript文件的文件的路径.

解决方法:

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

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

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

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

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

有关Polymer默认情况下不重写模板中URL的原因的详细信息,请参见see the documentation on DOM templating.

(顺便说一下,看起来那个页面上有关importPath的东西需要更新.我在raised an issue用我上面概述的最新信息更新网站.)

希望有所帮助

标签：javascript,svg,polymer,relative-path
来源： https://codeday.me/bug/20190910/1800130.html