纸张菜单按钮 - 如何读取所选菜单项

时间:2014-07-17 07:32:59

标签: polymer

我正在寻找了解聚合物的工作原理。如何处理从标记列表中选择菜单项?

<paper-menu-button icon="menu">
 <div>kg</div>
 <div>pcs</div>
 <div>lt</div>
</paper-menu-button>

1 个答案:

答案 0 :(得分:4)

以下是将事件功能绑定到菜单项的弹出菜单的示例。它使用 paper-items 而不是 divs ,但 divs 也可以。

<!doctype html>
<html>
<head>

    <script src="../lib/platform/platform.js"></script>
    <link href="../lib/core-icons/core-icons.html" rel="import">
    <link href="../lib/paper-menu-button/paper-menu-button.html" rel="import">
    <link href="../lib/paper-item/paper-item.html" rel="import">

</head>

<body unresolved>

    <polymer-element name="my-menu">
        <template>
            <paper-menu-button icon="menu">
                <paper-item on-tap="{{refresh}}">Refresh</paper-item>
                <paper-item on-tap="{{help}}">Help</paper-item>
                <paper-item on-tap="{{signOut}}">Sign out</paper-item>
            </paper-menu-button>
        </template>

        <script>
            Polymer('my-menu', {
                refresh: function () { console.log('Refresh'); },
                help: function () { console.log('Help'); },
                signOut: function () { console.log('Sign out'); }
            });
        </script>
    </polymer-element>

    <my-menu></my-menu>

</body>

</html>