Question

此刻，我正在使用Polymer和Go构建应用程序，而我刚刚遇到了这个问题。

我将数据存储在MongoDB中，并且正在使用JWT进行身份验证。我将在此处使用的数据是用户{电子邮件，...}和邀请{发送者，接收者，事件，消息......

问题是：我做了一个新功能，我需要HTTP请求将用户的电子邮件作为自变量，但是我收到错误消息：无法从Google控制台获取未定义的“电子邮件”。

为此，我有2种聚合物成分 1-获得“邀请”的组件（消息，发件人，事件） 2-使用（1）的组件，它只是一个转发器，用于显示用户收到的所有邀请。

我试图利用其他组件来获取当前用户的电子邮件，但它也无法正常运行，这是this.me.Email的同样问题（请参见下面的代码）

（1）['collab-service']。me（this.token）将用户的数据返回到属性'me'中，以便我可以访问我。给我发电子邮件（我在这里需要什么）

 static get properties() {
            return {
                invitation: {
                    type: Object,
                    notify: true,
                },
                /**
                 * Current user
                 * @public
                 * @type {Object}
                 **/
                me: {
                    type: Object,
                    notify: true,
                    reflectToAttribute: true,
                },
            };
        }

        /**
         * @inheritdoc
         **/
        connectedCallback() {
            super.connectedCallback();
            this.token = localStorage.getItem('token');

            this.$['collab-service'].me(this.token).then(
                (request) => {
                    this.me = request.response;
                },
                (error) => {
                    console.error('Error.');
                    console.error(error);
                }
            );

（2）GetInvitation（用户的电子邮件）返回用户收到的所有邀请


<div class="container">
                <template is="dom-repeat" items="{{invitation}}" as="item">
                    <MyComponent1 pub="{{item}}"></MyComponent1>
                </template>
            </div>

{......}
 static get is() {
            return 'myFile2';
        }

        static get properties() {
            return{
            };
        }
        connectedCallback() {
            super.connectedCallback();
            this.$['invitations-service'].getInvitations(this.me.Email).then(
                (request) => {
                    this.invitation = request.response;
                },
                (error) => {
                    console.error('Error.');
                    console.error(error);
                }
            );
        }

所以我需要做的是this.me.Email，这样我才能看到每个邀请。我将元素{{me.Email}}放入HTML代码中，以查看“ me”属性中是否包含某些内容并且“ me.Email”存在。它返回当前用户的电子邮件。它只是在getInvitation方法中不起作用，我也不知道为什么。

谢谢您的帮助！

编辑：我更改为代码，添加了一个以加载邀请，并且它可以访问this.me.Email属性... 它现在可以解决问题，但是确实不是很优雅。我认为这是由于加载了me属性，在尚未加载时使用了它，因此，在加载页面时，我可以访问me属性，但不能在加载时使用。

Answer 1

为什么您在me属性上具有reflectToAttribute？ ReflectionToAttribute仅用于DOM，因此您可以向元素添加属性，例如hidden或name="MyElement"，这些元素通常用于设置元素的样式。

hidden: {
  type: Boolean,
  value: true,
  reflectToAttribute: true
},
name: {
  type: String,
  value: 'MyElement',
  reflectToAttribute: true
},

在DOM中，上方的元素类似于<my-element hidden name="MyElement">。

notify: true用于将变量更新从子元素发送到父元素。

<parent-element>
  <child-element child-data={{parentVariable}}></child-element>
</parent-element>

使用大括号{{}}放置属性会告诉父元素更新的数据可以来自子元素。

static get is() {
            return 'parent-element';
        }

        static get properties() {
            return{
               parentVariable: Object
            };
        }

在此示例中，父元素没有向其子元素发送任何内容。

static get is() {
            return 'child-element';
        }

        static get properties() {
            return{ 
              childData: {
                type: Object,
                notify: true
              }
            };
        }

        ready() {
          super.ready();

          this.set('childData', {'test': 'hello world'});
        }

由于子元素在notify: true上有childData，因此设置该属性现在会将父元素中的parentVariable更新为相同的值。

如果要在DOM或属性中进行任何更新，则需要使用this.set('myVariable', aValue)而不是this.myVariable = aValue。

您似乎想在connectedCallback中使用异步数据，但是不能确定是否已加载。当然，当您尝试查看该属性是否存在时，它会随后加载。看来您是从编辑过的更新中看出来的，但您可能应该设置属性的双向绑定，而不是querySelect元素，然后放置一个观察者以查看元素何时更新。

如果我继续上面的示例：

static get is() {
            return 'parentElement';
        }

        static get properties() {
            return{
               parentVariable: {
                 type: Object,
                 observer: 'testObserver'
            };
        }

        testObserver(newChildData) {
          console.log(newChildData); // {'test': 'hello world'}

          // do other stuff, like getInvitations(newChildData.test)
        }

如何获取数据的特定字段以在请求中使用它？

1 个答案: