将边框半径应用于纸张复选框？没有可用的混合

Question

聚合物 1.*

有没有办法将 border-radius: 50% 应用到 paper-checkbox 因为它没有可用的混合？并且 /deep/ 早已被弃用。

      <paper-checkbox
        name="apples"
        class="checkbox"
        value="1">1</paper-checkbox>

Answer 1

<paper-checkbox> 的复选框的 ID 为 "checkbox"，因此您可以使用 Automatic node finding 语法 (this.$.myPaperCheckbox.$.checkbox) 强制获取对它的引用以设置样式内部复选框的边框半径 (checkbox.style.borderRadius):

attached: function() {
  // <paper-checkbox id="myPaperCheckbox">
  this.$.myPaperCheckbox.$.checkbox.style.borderRadius = '50%';
}

结果：

demo

您也可以考虑切换到 <paper-radio-button>，它已经使用了圆形复选框（但带有 different/circular 复选标记）。