ready函数调用时，domHost的signedIn属性为false [英] signedIn property of domHost is false on ready function call

问题描述

我想检查用户是否登录了元素创建，并最终重定向他，如果用户不是。问题是，即使用户是signedIn domHost.signedIn属性是false。如果我稍后检查属性（例如，当我使用按钮点击调用某个函数），属性是正确的。

以下是代码：

 < link rel = importhref =../ bower_components / polymer / polymer.html> 
 
< link rel =importhref =/ bower_components / paper-button / paper-button.html> 
 
< dom-module id =settings-view> 
< template> 
< style> 
< / style> 
 TODO：用户设置
<纸张按钮on-tap =debugFunction>按钮< /纸张按钮> 
< / template> 
 
< script> 
 Polymer（{
是：'settings-view'，
 
 ready：function（）{
 console.log（this.domHost.signedIn）; // false 
 console.log（this.domHost.user）; // null 
}，
 
 debugFunction：function（）{
 console.log（this.domHost .signedIn）; // true 
 console.log（this.domHost.user）; //用户对象
} 
}）; 
< / script> 
< / dom-module> 
  

检查用户是否在子元素中登录的最佳方法是什么？将signedIn值设置为iron-meta元素会更好吗？

Thanks，Jan

解决方案

你最好用观察员在他们身上。只要属性的值不是 undefined ，观察者就会执行该函数。所以你的代码如下所示：

$ b

 < link rel =importhref = ../bower_components/polymer/polymer.html\"> 
 
< link rel =importhref =/ bower_components / paper-button / paper-button.html> 
 
< dom-module id =settings-view> 
< template> 
< style> 
< / style> 
 TODO：用户设置
< / template> 
 
< script> 
 Polymer（{
 is：'settings-view'，
 
 properties：{
 signedIn：{
 type：Boolean，
 observer ：'_signedInChanged'
}，
 
 user：{
 type：Object，
 observer：'_userChanged'
}，
}， 
 
 _signedInChanged：function（newSignedInValue）{
 console.log（newSignedInValue）; // true 
 console.log（this.signedIn）; // true 
} ，
 
 _userChanged：function（newUserValue）{
 console.log（newUserValue）; //用户对象
 console.log（this.user）; //用户对象
} 
}）; 
< / script> 
< / dom-module> 
  

然后当你更新那些 signedIn 和 user 值通过JavaScript或数据绑定，观察者将调用相关函数。

I want to check if the user is logged in on element creation and eventually redirect him if the user is not. The problem is that the domHost.signedIn property is false even though the user is signedIn. If I check the property later(for example when I call a function with button tap) the property is true as it should be.

Here is the code:

<link rel="import" href="../bower_components/polymer/polymer.html">

<link rel="import" href="/bower_components/paper-button/paper-button.html">

<dom-module id="settings-view">
    <template>
        <style>
        </style>
        TODO: user settings
        <paper-button on-tap="debugFunction">button</paper-button>
    </template>

    <script>
        Polymer({
            is: 'settings-view',

            ready: function () {
                console.log(this.domHost.signedIn); // false
                console.log(this.domHost.user);  // null
            },

            debugFunction: function () {
                console.log(this.domHost.signedIn); // true
                console.log(this.domHost.user); // user object
            }
        });
    </script>
</dom-module>

What is the best way to check if the user is signedIn in child element? Would setting the signedIn value to iron-meta element be a better approach?

Thanks, Jan

解决方案

You're better off declaring properties with observers on them. Observers will execute the function as soon as the property's value is something other than undefined. So your code will look like this:

<link rel="import" href="../bower_components/polymer/polymer.html">

<link rel="import" href="/bower_components/paper-button/paper-button.html">

<dom-module id="settings-view">
    <template>
        <style>
        </style>
        TODO: user settings
    </template>

    <script>
        Polymer({
            is: 'settings-view',

            properties: {
                signedIn: {
                    type: Boolean,
                    observer: '_signedInChanged'
                },

                user: {
                    type: Object,
                    observer: '_userChanged'
                },
            },

            _signedInChanged: function (newSignedInValue) {
                console.log(newSignedInValue); // true
                console.log(this.signedIn); // true
            },

            _userChanged: function (newUserValue) {
                console.log(newUserValue); // user object
                console.log(this.user); // user object
            }
        });
    </script>
</dom-module>

Then when you update those signedIn and user values through JavaScript or data binding, the observers will call the associated functions.

这篇关于ready函数调用时，domHost的signedIn属性为false的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！