[Vuetify] v-select에서 [object, object]가 표시되면 해결책
현상
items: [{id:1, text: 'テキスト'},{id:2, text: 'テキスト2'},{id:3, text: 'テキスト3'}]
위와 같은 객체의 배열을 v-select로 표시.
<v-select
:items="items"
/>
그러면 다음과 같이
[object, object]
라고 표시된다.해결책
vuetify의 공식 페이지에는 객체 사용시의 설명이 있었다.
items-text 사용
item-text="オブジェクトのプロパティ名"
사용하여 해결
<v-select
item-text="text"
:items="items"
/>
items-value를 사용하여 값 지정
어디까지나 표시는 할 수 있었지만, 필터링할 때 등, 표시와 뒤로 유지하는 값을 각각 나누고 싶은 경우는
items-value
를 사용한다.실제로 값을 확인하기 위해
@change="changedValue"
를 추가하고 select 선택시 console.log에서 값을 출력합니다.
<v-select
item-text="text"
item-value="id"
:items="items"
@change="changedValue"
/>
methods: {
changedValue(value) {
console.log('value', value)
}
}
表示
値
무사, 표시와 값을 나눌 수 있었으므로 해결.
참고문헌
Reference
이 문제에 관하여([Vuetify] v-select에서 [object, object]가 표시되면 해결책), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/bbapexx/items/299521d49df0869dc44f텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)