1

Получаю данные через https://vk.com/dev/wall.get После разбираю их так:

<template>
  <div class="walls">
    <div class="loading" v-if="loading">
      Loading...
    </div>

    <div v-if="error" class="error">
      {{ error }}
    </div>
    <div class="album py-5 bg-light"  v-if="walls">
        <div class="container">
          <div class="row">

            <div class="col-md-4"  v-for="wall in walls">
              <div class="card mb-4 shadow-sm">          

                <img v-if="wall.copy_history" class="card-img-top" style="height: 225px; width: 100%; display: block;" src="">                                                              
                <div class="card-body">                                  
                  <a v-if="wall.attachments" :href="'https://vk.com/wall'+wall.owner_id +'_'+ wall.id">                   
                    <p class="card-text">{{ wall.text }}</p>                                                   
                  </a>
                  <a v-else-if="wall.copy_history" :href="'https://vk.com/wall'+wall.copy_history[0].owner_id +'_'+ wall.copy_history[0].id">                                     
                    <p class="card-text">{{wall.copy_history[0].text}}</p>                                 
                  </a>
                  <a v-else :href="'https://vk.com/wall'+wall.owner_id +'_'+ wall.id">                   
                    <p class="card-text">{{ wall.text }}</p>                                                   
                  </a>
                  <div class="d-flex justify-content-between align-items-center">      
                    <small class="text-muted">{{ wall.id }}</small> 
                  </div>
                </div>
              </div>
            </div>     

          </div>          
        </div>
    </div>

  </div>
</template>
<script>
import axios from 'axios';
export default {
  data() {
    return {
      loading: false,
      walls: null,
      error: null,
    };
  },
  created() {
    this.fetchData();
  },
  methods: {
    fetchData() {
      this.error = this.walls = null;
      this.loading = true;
      axios
        .get('/api/walls')
        .then(response => {              
            this.loading = false;
            this.walls = response.data.items;
        }).catch(error => {
            this.loading = false;
            this.error = error.response.data.message || error.message;
        });
    }
  }
}
</script>

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

attachments
и при его наличии - вывести.

Голову сломал... Подскажите..

1 ответ 1

1

Добавление фотографий, в then вместо this.walls = response.data.items; добавь

            var attach = [];//Создаем пустой массив
            for(var i=0; i<response.data.items.length; i++) {//перебираем все полученные данные с сервера
                attach = [];//Очищаем массив
                if(response.data.items[i]['attachments']) {//проверяем есть ли attachments
                    for (var s = 0; s < response.data.items[i]['attachments'].length; s++) {//Перебираем все, что прикреплено
                        if (response.data.items[i]['attachments'][s]['type'] == "photo") {//Если прикреплена фотография
                            attach.push(response.data.items[i]['attachments'][s]['photo']['photo_1280']);//Добавляем ее в массив attach
                        }
                    }
                    response.data.items[i].attach = attach;//И добавляем полученный массив attach в основной массив
                }
                this.walls.push(response.data.items);//Добавляем полученный данные в walls
            }

И после

<div class="d-flex justify-content-between align-items-center">      
  <small class="text-muted">{{ wall.id }}</small> 
</div>

вставь

<div v-if="wall.attach">
  <div v-for="at in wall.attach">      
    <img :src="at">
  </div>
</div>

Делал по примеру из ссылки

"attachments": [{
"type": "photo",
"photo": {
"id": 456239461,
"album_id": -7,
"owner_id": -86529522,
"user_id": 100,
"photo_75": "https://pp.userap...5a3/_LwF-Hsv4B4.jpg",
"photo_130": "https://pp.userap...5a4/k8a0uXCbkMY.jpg",
"photo_604": "https://pp.userap...5a5/TKjIcburlwc.jpg",
"photo_807": "https://pp.userap...5a6/tdN8S-RaCQw.jpg",
"photo_1280": "https://pp.userap...5a7/E0vOE2dnkNY.jpg",
"width": 1280,
"height": 853,
"text": "",
"date": 1489591865,
"access_key": "c543a7268173be3a73"
}
}

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.