Question

我正在使用Polymer处理自定义元素。我想在渲染后改变它的中心。我无法在Polymer docs上找到它。有人可以帮帮我吗？

<dom-module id="my-map">
<template>
    <google-map latitude="{{latitude}}" longitude="{{longitude}}" zoom="15">
    </google-map>
</template>

<script>
Polymer({
    is: "my-map"

    // I want to change map center here
});

    // or here.. I don't know
</script>

Answer 1

在<script>标记中，您可以创建就绪回拨函数。见lifecycle callbacks

Polymer添加了一个额外的回调，就绪，当Polymer完成创建和初始化元素的本地DOM时调用它。

在此处，您可以更改要传递到longitude元素的latitude元素的my-map和google-map属性：

<dom-module id="my-map">
    <style>
        google-map {
            height: 600px;
            width: 600px;
        }
    </style>
    <template>
        <google-map latitude="{{latitude}}" longitude="{{longitude}}" zoom="15"></google-map>
    </template>
</dom-module>

<script>
    Polymer({
        is: "my-map",
        ready: function () {
            this.latitude = 37.77493;
            this.longitude = -122.41942;
        }
    });
</script>

或者，如果您可以提供longitude和lattitude属性默认值（see here）：

<script>
    Polymer({
        is: "my-map",
        properties: {
            longitude: {
                type: Number,
                value: -122.41942
            },
            latitude: {
                type: Number,
                value: 37.77493
            }
        }
    });
</script>

使用Polymer更改google-map中心

1 个答案: