Как получить конкретное поле данных, чтобы использовать его в запросе? - PullRequest
Новая
       34

Как получить конкретное поле данных, чтобы использовать его в запросе?

0 голосов
/ 27 мая 2019

Я сейчас создаю приложение с помощью Polymer и Go, и я только что решил эту проблему.

Мои данные хранятся в MongoDB, и я использую JWT для аутентификации. Здесь я буду использовать данные пользователя {email, ...} и приглашение {отправитель, получатель, событие, сообщение, ...}

Проблема в том, что я создал новую функциональность, и мне нужно, чтобы в моем 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, но не так, как я загружаю его.

1 Ответ

0 голосов
/ 30 мая 2019

Почему у вас есть отражение атрибута me?ReflectToAttribute только для 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'});
        }

Потому что child-элемент имеет 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)
        }
...