반응형
Axios/Vuex api 쿼리가 작동하지 않음, 매개 변수 오류
iTunes API를 쿼리하는 Vue 앱에서 Axios와 Vuex를 사용하고 있지만 검색/텍스트 필드에서 입력된 값을 가져오는 데 문제가 있다.쿼리 문자열에서 매개 변수 인수에 대한 오류가 표시됨.코드는 아래에 있다.
검색 상자
<v-text-field
v-model="search"
autofocus
@keyup.enter="searchData(params)"
label="Enter Artists Name"
append-icon="search">
</v-text-field>
그리고 searchData 기능은
async searchData({ params }) {
let config = {
headers: {
'Accept': 'application/json'
}
}
const response = await this.$http.get(`https://itunes.apple.com/search? term=${params.id}&entity=album`, config);
//store.commit('add', response.data.results);
console.log(response.data.results);
}
}
에러는
정의되지 않은 속성 'id'를 읽을 수 없음
키업으로
그래서 검색창에 들어가는데 안 되는 아티스트 이름을 전달하려고?
환영해, 고마워
아래에서 시도하십시오.
<v-text-field
v-model="search"
autofocus
@keyup="searchData($event)"
label="Enter Artists Name"
append-icon="search"
></v-text-field>
searchData 함수
async searchData(event: any) {
console.log("value: ", event.target.value)
console.log("search: ", this.search)
// let config = {
// headers: {
// 'Accept': 'application/json'
// }
// }
// const response = await this.$http.get(`https://itunes.apple.com/search?
// term=${params.id}&entity=album`, config);
// //store.commit('add', response.data.results);
// console.log(response.data.results);
//}
}
전역 변수 "search" 또는 "event.target.value"를 사용할 수 있다.이것은 TypeScript 버전에서 작동하고 있다.JS랑도 같이 일해야겠어
다음 방법:
@keyup.enter="searchData(params)"
이사Vue
고유 이벤트가 아닌 이벤트.그렇게params
이 경우 텍스트 필드의 값일 뿐이다.그것은 물건이 아니다.구조화 할 수 없다.params
func 논쟁에서, 그리고 당신은 접근할 수 없다.id
그것은 물건이 되지 않을 것이기 때문에 그것에서 벗어났다.
반응형
'programing' 카테고리의 다른 글
스틴트를 사용해야 하는 이유(또는 사용하지 않는 이유) (0) | 2022.05.11 |
---|---|
vue js의 html 속성에서 메서드를 호출하는 방법 (0) | 2022.05.11 |
Vue.js 문 닫는 동안 차단되지 않음(진행이 완료될 때까지 백엔드 대기) (0) | 2022.05.11 |
반올림 정수 분할(잘리는 대신) (0) | 2022.05.11 |
휘발성 대 원자성 (0) | 2022.05.11 |