Доступ к значению JSON executementValue - PullRequest
Новая
       33

Доступ к значению JSON executementValue

0 голосов
/ 05 декабря 2018

Я новичок в Vue , и я использую электронно-Vue шаблон.Я пытаюсь отобразить некоторые элементы в Amazon, используя Promise в NodeJS.Я использую " amazon-product-api " и да, у меня есть доступ к API рекламы продуктов Amazon.Я написал свой код в отдельном файле .js и соединился в компоненте Vue.

Это моя функция для получения ItemSearch с помощью amazon-product-api, 

// This function will take take idea and give stats in return
// @input string
// @return json
function getKeywordStats (keyword, searchType, delay, domain) {
  // Setting URL and headers for request
  if (searchType === 0) {
    searchType = 'KindleStore'
  } else {
    searchType = 'Books'
  }

  if (domain === 'com') {
    domain = 'webservices.amazon.com'
  } else if (domain === 'de') {
    domain = 'webservices.amazon.de'
  } else if (domain === 'uk') {
    domain = 'webservices.amazon.uk'
  }

  var query = {
    keywords: keyword,
    searchIndex: searchType,
    sort: 'relevancerank',
    itemPage: 1,
    availability: 'Available',
    responseGroup: 'Large',
    domain: domain
  }
  return new Promise(function (resolve, reject) {
    amazonClient.itemSearch(query, function (error, results) {
      if (error) {
        console.log(error)
      } else {
        var title = results[0].ItemAttributes[0].Title[0]
        var imageUrl = results[0].ItemAttributes[0].Title[0]
        var data = {
          title: title,
          imageUrl: imageUrl
        }
        // console.log(results)
        // var noCompetitors = results.ItemAttributes.Items.TotalResults
        resolve(data)
      }
    })
  })
}

Этомой компонент Vue, 

<template>
    <div class='hello'>
        <p> {{data}} </p>
    </div>
</template>

<script>
/* eslint-disable no-unused-vars */
// ebook data - 0
// book data - 1

var amazon = require('../../controllers/amazon-service.js')

var keywordDictionary = {}

var getStats = amazon.getKeywordStats('trump aftershock', 0, null, 'de')
console.log()

export default {
  data () {
    return {
      data: [
        {
          terms: getStats
        }
      ]
    }
  }
}
</script>

<style>
.hello {
  color: blue
}
</style>

Когда я запускаю это, я могу показать данные обещания в моем компоненте Vue.Вот как это было показано на странице. 

[ { "terms": { "isFulfilled": true, "isRejected": false, "fulfillmentValue": { "title": "Trump Aftershock: The President's Seismic Impact on Culture and Faith in America (English Edition)", "imageUrl": "Trump Aftershock: The President's Seismic Impact on Culture and Faith in America (English Edition)" } } } ]

Но я не смог получить " assignmentValue ".Я приложу несколько скриншотов, которые помогут решить эту проблему.Если я делаю это неправильно, направьте меня по правильному пути.

Что показывает приложение -

electron-vue response

Проверен ответ JSON-

json valid

1 Ответ

0 голосов
/ 05 декабря 2018

Функция Amazon API getKeywordStats возвращает Promise - это асинхронная операция.Это означает, что функция не возвращает результат, как обычная синхронная функция, вместо этого она возвращает объект Promise, который можно зарегистрировать функцией обратного вызова (через then), которая будет вызвана после извлечения данных.Обязательно прочтите, как работают обещания;Я не буду вдаваться в подробности, так как о них уже много информации.

Переместите вызов API в ваш компонент created hook: 

export default {
  data() {
    return {
      terms: null
    }
  },

  created() {
    amazon.getKeywordStats('trump aftershock', 0, null, 'de').then(terms => {
      this.terms = terms
    })
  }
}
...