(VUEJS) методы доступа из Axios внутри созданного - PullRequest
Новая
       8

(VUEJS) методы доступа из Axios внутри созданного

0 голосов
/ 26 июня 2018

У меня просто простая ошибка, которая сбивает меня с толку почти 3 недели.

мой вопрос о том, что я хочу вернуть строку из методов "idvideo" в конце URL-адреса моего axios API, но ничего не происходит.

как вы можете видеть на моем коде ниже.

Я искал решение и много раз пытался найти ошибку, но так и не нашел лучшего ответа, который мог бы мне помочь. 

    export default {

        data() {
          return {
            errors: [],
            videos: [],
            items: []

          }
        },

        methods: {
          idvideo: function() {
            const data = this.items
            const result = data.map((item) => {
              return {
                fetchId: item.snippet.resourceId.videoId
              };
            }).sort((a, b) => b.count - a.count);

            var i, len, text;
            for (i = 0, len = result.length, text = ""; i < len; i++) {
              text += result[i].fetchId + ",";
            }
            var x = text.slice(0, -1);
            return(x);
          }

        // Fetches posts when the component is created.
        created() {

          // Ini adalah API utk playlist yang dipilih
          axios.get("https://www.googleapis.com/youtube/v3/playlistItems?part=snippet&maxResults=50&playlistId=PLjj56jET6ecfmosJyFhZSNRJTSCC90hMp&key={YOUR_API_KEY}")
          .then(response => {
            // JSON responses are automatically parsed.
            this.items = response.data.items
          })
          .catch(e => {
            this.errors.push(e)
          }),

          // Ini adalah API utk data yang dipilih
          axios.get('https://www.googleapis.com/youtube/v3/videos?part=snippet%2CcontentDetails%2Cstatistics&key={YOUR_API_KEY}&id='+this.idvideo())
        .then(response => {
            // JSON responses are automatically parsed.
          this.videos = response.data.items
          })
          .catch(e => {
            this.errors.push(e)
          })
        },
        }

Я действительно ценю любые решения, которые могут мне помочь. Если у вас, ребята, есть лучший способ реализовать эту функцию, дайте мне знать.

Извините за мой плохой английский и любые ошибки. Это мой второй вопрос на этой платформе.

Большое спасибо, сэр!

1 Ответ

0 голосов
/ 27 июня 2018

Поскольку это асинхронные запросы, у меня на уме следующее решение.

Решение:

Переместить следующий вызов axios в первый вызов axios. Это связано с тем, что только после первого вызова будут извлечены «элементы», которые затем будут присвоены this.items Таким образом, при следующем вызове axios будут получены необходимые данные из функции idvideo(). 

export default {
    data() {
      return {
        errors: [],
        videos: [],
        items: []

      }
    },

    methods: {
      idvideo: function() {
        const data = this.items
        const result = data.map((item) => {
          return {
            fetchId: item.snippet.resourceId.videoId
          };
        }).sort((a, b) => b.count - a.count);

        var i, len, text;
        for (i = 0, len = result.length, text = ""; i < len; i++) {
          text += result[i].fetchId + ",";
        }
        var x = text.slice(0, -1);
        return(x);
      }

    // Fetches posts when the component is created.
    created() {

      // Ini adalah API utk playlist yang dipilih
      axios.get("https://www.googleapis.com/youtube/v3/playlistItems?part=snippet&maxResults=50&playlistId=PLjj56jET6ecfmosJyFhZSNRJTSCC90hMp&key={YOUR_API_KEY}")
      .then(response => {
        // JSON responses are automatically parsed.
        this.items = response.data.items

        // Ini adalah API utk data yang dipilih
      axios.get('https://www.googleapis.com/youtube/v3/videos?part=snippet%2CcontentDetails%2Cstatistics&key={YOUR_API_KEY}&id='+this.idvideo())
    .then(response => {
        // JSON responses are automatically parsed.
      this.videos = response.data.items
      })
      .catch(e => {
        this.errors.push(e)
      })
    }
      })
      .catch(e => {
        this.errors.push(e)
      }),
      ,
    }
...