Polymer 2.0 自定义样式 属性 在 dom-模块下不工作

Question

我已经将 polymer 项目升级到 2.0 版本。之后 div 中缺少一些 css class。

有一个link到iron-flex-layout.html来自my-home.html

<link rel="import" href="bower_components/iron-flex-layout/iron-flex-layout.html">

并且在my-home.html页面中有如下样式：

<dom-module id="my-home">
<template>
<style is="custom-style">
.flex-vertical {
  @apply --layout-vertical;
  height: 100vh;
}

.flexchild-vertical {
  @apply --layout-flex;
  @apply --layout-horizontal;
}
</style>
</template>
</dom-module>

这些款式来自 iron-flex-layout.html

--layout-vertical
--layout-flex
--layout-horizontal

但它没有加载到我的输出中。这是我浏览器的截图：

旧版本：

升级版：

我认为这个问题可能是因为 #shadow-root 产生的。

我可以在我的代码中更改样式 links / html links 或任何其他样式吗？

Answer 1

是的！从这里得到答案：https://www.polymer-project.org/2.0/docs/upgrade#class-based-elements-import-the-css-mixin-shim

是iron-flex-layout的版本问题。我刚刚更新了它，现在一切都很好。

最新版本 (2.0) 有一个 <custom-style> 对象将整个样式包装在 iron-flex-layout.html

中

这是最新版本：https://github.com/PolymerElements/iron-flex-layout