我有一个 Polymer 组件,它在其模板(一个按钮容器)中使用了另一个组件。所述子组件还使用另一个组件(按钮本身),当它被禁用时我需要向该按钮添加一些样式。像这样:
<dom-module id="parent-component">
<template>
... template elements
<confirm-buttons-container id="child-component" config$="[[someConfigVariable]]" ></confirm-buttons-container>
</template>
</dom-module>
子组件是这样的:
<dom-module id="confirm-buttons-container">
<template>
<dom-if if="[[config.buttons.primary]]">
<template>
<grandchild-component-button class$="[[config.buttons.primary.class]]">
<button
id="primaryBtn"
name="primary"
inner-h-t-m-l="[[t(config.buttons.primary.text)]]"
disabled$="[[config.buttons.primary.disabled]]">
</button>
</grandchild-component-button>
</template>
</dom-if>
</template>
</dom-module>
子组件有一个 mixin 来设置孙组件的样式,它还有一个 mixin 来设置我想要更改的属性的样式。当 config.buttons.primary.disabled 为 true 时,如何从父组件访问所述 mixin
在此先感谢您的帮助。
最佳答案
将此 css 添加到您的样式中:
#parent-component #confirm-buttons-container [disabled="true"]{ color:red; }
关于css - 如何在 Polymer 中访问孙元素的 css mixin?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57691152/