Question

我有使用聚合物内置元素的html页面以及我的customElement（ my-form ）

<dom-module id="my-form">
    <template>
        <div>
            <paper-input id="inputName" label="Name" required error-message="Required Input" value="{{data.name}}"> Name </paper-input>
            <paper-input id="inputAge" label="Age" required error-message="Required Input" value="{{data.age}}"> Age </paper-input>
            <div class="rows layout horizontal">
                <paper-button id='cancelBtn' tabindex="0">Cancel</paper-button>
                <paper-button id='saveBtn' tabindex="0">Save</paper-button>
            </div>
        </div>
    </template>
</dom-module>
<script>
    Polymer({

        is: 'my-form',

        created: function() {
            var saveBtn = document.querySelector('#saveBtn');
            saveBtn.addEventListener('click', function() {
                document.getElementById('inputName').validate();
                document.getElementById('inputAge').validate();
            });

            //initial value
            this.data = {};  

        },

        properties: {
            data: {
                type: Object,
                value: {},
            },
        }

        //load my-form with data provided  
        refreshFormUI: function(dataReceived) {
            this.data = dataReceived;
            console.log("refreshFormUI() -  name = " + this.data.name);
            console.log("refreshFormUI() -  age = " + this.data.age);
        },

    });
</script>

我需要从外部javascript文件传递＆＃34; 数据＆＃34;对象。我尝试了以下但我没有看到 refreshFormUI（） 被调用。

external_js_file.js：

function someEvent() {
    my_form_element = document.querySelector('#my_form_element');
    var mockData = {
        name: "Demo Name",
        age: '20',
    };
    my_form_element.refreshFormUI(mockData);
}

Answer 1

您正在设置this.data =，但在console.log中使用data.name代替this.data.name。

如何调用Polymer Custom Element中定义的函数并传递参数？

1 个答案: