Question

我试图在纸张列表框中嵌入一组纸质无线电按钮（由纸张无线电组封装），以便让它们在不同的行上显示。这样做的正确方法是什么？我目前的实施尝试如下：

<paper-listbox>
    <paper-radio-group>
       <paper-radio-button name="1">1</paper-radio-button>
       <paper-radio-button name="2">2</paper-radio-button>
       <paper-radio-button name="3">3</paper-radio-button>
       <paper-radio-button name="4">4</paper-radio-button>
       <paper-radio-button name="5">5</paper-radio-button>
       <paper-radio-button name="6">6</paper-radio-button>
   </paper-radio-group>
</paper-listbox>

Answer 1

在display: block上设置paper-radio-button：

paper-radio-button {
  display: block;
}

＆＃13;

HTMLImports.whenReady(() => {
  Polymer({
    is: 'x-foo'
  });
});

＆＃13;

<head>
  <base href="https://polygit.org/polymer+1.7.1/components/">
  <script src="webcomponentsjs/webcomponents-lite.min.js"></script>
  <link rel="import" href="polymer/polymer.html">
  <link rel="import" href="paper-listbox/paper-listbox.html">
  <link rel="import" href="paper-radio-button/paper-radio-button.html">
  <link rel="import" href="paper-radio-group/paper-radio-group.html">
</head>
<body>
  <x-foo></x-foo>

  <dom-module id="x-foo">
    <template>
      <style>
        paper-radio-button {
          display: block;
        }
      </style>
      <paper-listbox>
        <paper-radio-group>
          <paper-radio-button name="1">1</paper-radio-button>
          <paper-radio-button name="2">2</paper-radio-button>
          <paper-radio-button name="3">3</paper-radio-button>
          <paper-radio-button name="4">4</paper-radio-button>
          <paper-radio-button name="5">5</paper-radio-button>
        </paper-radio-group>
      </paper-listbox>
    </template>
  </dom-module>
</body>

＆＃13;

codepen

在纸质列表框中嵌套一组纸质收音机按钮的正确方法是什么？

1 个答案: