Vue CLI - TypeError: 정의되지 않은 속성을 읽을 수 없습니다('1' 읽기).

Question

저는 VueJS 초보자입니다. 여러분의 도움을 받고 싶습니다.

저는 OpenWeatherMap API를 기반으로 일기예보 애플리케이션을 만들려고 합니다.

콘셉트는 이렇습니다

1. 홈페이지에 위치를 입력하고 검색 버튼을 누르세요. (내 코드에서는 구성 요소입니다 Search.vue)
2. 다른 페이지로 리디렉션하고 결과를 표시합니다(현재 날씨 및 향후 6일 동안의 일기 예보). (컴포넌트 Weather.vue)

두 번의 일관된 가져오기 호출이 포함된 함수를 만들었습니다. 먼저 입력의 입력을 받으세요query 并从 Current Weather Data API 返回所需的数据。之后，函数运行第二次获取到 One 根据第一次获取的 latitude longitude 调用 API .

모든 것이 제대로 작동하고 표시되지만 콘솔에 오류 Uncaught (in Promise) TypeError: Cannot readproperties of undefined (reading '1')가 발생하는 이유를 모르겠습니다.

이 오류 해결 방법을 아시는 분 계신가요?

내 Search.vue(홈) 구성 요소:

으아악

내 Weather.vue(날씨 결과 표시 페이지) 구성요소:

으아악

내 router/index.js 파일:

<template>
    <div class="row">
        <div class="search-col col">
            <div class="search-box">
                <input 
                    type="text" 
                    class="search-bar" 
                    placeholder="Location" 
                    v-model="query">
                <router-link :to="{name: 'DetailedWeather', params: { query: query }}" class="btn-search">
                    <i class="fas fa-search"></i>
                </router-link>
            </div>
        </div>
    </div>
</template>

Answer 1

내 추측에 따르면(코드와 오류가 주어졌을 때) API에서 받은 개체에 문제가 있을 수 있습니다.

오류 메시지는 정의되지 않은 배열의 특정 인덱스에서 무언가를 읽으려고 함을 나타냅니다.

코드에서 이 오류를 일으킬 수 있는 유일한 상황은 읽고 있는 템플릿 때문입니다. 예:

으아아아

정확히 어떤 것인지는 알 수 없지만, 작업 중인 물체의 모양을 다시 확인해 보세요.