VueJS получить обещания - PullRequest
0 голосов
/ 28 мая 2020

У меня есть компонент:

Vue.component('mail-list', {
  props: ['userInbox'],
  template:
  `
  <div>
    <p>{{userInbox}}</p>
  </div>
  `
  });

Я хочу напечатать содержимое реквизитов p тега, которое является результатом created function

let options = {
  el: "#app",
  data: {
    pollingId: null,
  },

  created: function() {

    let users = fetch('/inbox')
    .then(response => response.json())
    .then(aJson => {return (aJson)})
    this.userInbox = users
  }
}
let vm = new Vue(options);

Но это возвращает только обещание, с которым я не могу работать.

Promise {<pending>}

Promise имеет следующее содержимое:

{ '1':
   Mail {
     id: 1,
     from: 'pep@mydomain.com',
     to: 'mar@mydomain.com',
     subject: 'Hi Mar',
     body: 'This is a test from pep to mar',
     timestamp: 1590647288599 },
  '6':
   Mail {
     id: 6,
     from: 'nil@mydomain.com',
     to: 'mar@mydomain.com',
     subject: 'By Mar',
     body: 'This is a test from nil to mar',
     timestamp: 1590647288599 } }

Я должен отобразить в теге p атрибуты from и subject каждого из них.

1 Ответ

1 голос
/ 28 мая 2020

Во-первых, не забудьте прописать userInbox в своих данных. Во-вторых, назначьте его в обратном вызове обещания

let options = {
  el: "#app",
  data: {
    pollingId: null,
    userInbox: ''
  },

  created: function() {

    let users = fetch('/inbox')
    .then(response => response.json())
    .then(aJson => {
      this.userInbox = aJson
    })

  }
}
let vm = new Vue(options);
...