Задать вопрос
@MaXX77777
vue

Добрый день! Как достучатся до определенного массива из объектов и до конкретного его свойства используя Axios и Vue js?

<body>
    <div id="app">
        <ul>
            <div v-for="messages in message">{{ messages.name }}</div>

        </ul>
    </div>
    <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/sass.js/0.11.1/sass.min.js"></script>

    <script>
        let app = new Vue({
            el: '#app',
            data: {
                message: ''
            },
            mounted() {
                axios
                    .get('test.json')
                    .then(response => (this.message = response.data));
            }
        })
    </script>

</body>



есть файл test.json


[
    {
        "name": "Vasia",
        "age" : "33"
    },
    {
        "name": "Ulia",
        "age" : "31"
    },

    {
        "name": "Petia",
        "age" : "35"
    },
    {
        "name": "Sergey",
        "age" : "30"
    }
]


Хочу достучаться до 3-го объекта в массиве и вывести только его имя (name) на странице.

Пример: Петя

Но у меня выводит весь список имен. Как это исправить? Спасибо!
  • Вопрос задан
  • 109 просмотров
1 комментарий
Подписаться 1 Средний 1 комментарий
Решения вопроса 1
sergiks
@sergiks
♬♬
Так у вас вот же, выводится весь массив в цикле: 
<div v-for="messages in message">{{ messages.name }}</div>


Сделайте вычисляемое свойство, например: 
computed: {
  thirdName() {
    if (this.messages.length >= 3) {
      return this.messages[2].name;
    }
  }
},
и показывайте его, когда не пустое: <div v-if="thirdName">Имя: {{ thirdName }}</div>

P. S. вывод всего списка:
Ответ написан
7 комментариев
7 комментариев
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Frontend-разработчик VUE (Senior, Middle+)
SOFT DIVISION • Ярославль
от 150 000 до 300 000 ₽
Второй ведущий разработчик (Fullstack, PHP, Laravel, Vue, Mysql)
Donatov.net
от 100 000 до 300 000 ₽
Frontend developer (middle/senior)
//stablecode
от 210 000 ₽
Ещё вакансии
Заказы с Хабр Фриланса
Доработать обмен заказами 1с
11 мая 2024, в 00:19
1000 руб./за проект
Разработка сайта (верстка)
10 мая 2024, в 23:51
30000 руб./за проект
Опубликовать приложение в Google play
10 мая 2024, в 23:33
2500 руб./за проект
Ещё заказы