sourcecode

Enter 키를 누르지 않고 칩을 사용하여 태그를 vuetify합니다.

copyscript 2022. 8. 13. 12:24
반응형

Enter 키를 누르지 않고 칩을 사용하여 태그를 vuetify합니다.

나의 뷰티파이 프로젝트에서 나는 이런 것을 가지고 있다.

 <v-select
    v-model="data.emails"
    label="Add multiple recipent by hitting enter"
    multiple
    tags
    chips
    solo

></v-select>

이 정도면 충분합니다.하지만 Enter 키를 눌러야만 작동합니다.이 목표를 달성하려면,왜냐하면 이메일 등 많은 아이템을 붙일 예정이기 때문입니다.그래서 나는 히트 엔터를 타보고 싶어.

혼수상태로 분리된 이메일을 많이 붙여 배열로 선택한 칩을 얻을 수 있는 방법이 있나요?

감사합니다.

유사한 동작에 대한 지원은 v1.1에 대해 계획되어 있습니다.
https://github.com/vuetifyjs/vuetify/issues/3287

댓글 중 하나에서 임시 해결책을 복사하겠습니다.
@jakarn은 다음과 같이 썼다.

예를 들어 다음과 같습니다.
더하다ref="tags"고객님께v-select요소
더하다@keyup.space="updateOnSpace('tags')"컴포넌트에 접속합니다.
를 추가하다method:updateOnSpace(tags) { this.$refs[tags].onEnterDown(); },


텍스트 값 붙여넣기(search-input값을 캡처합니다.)를 구분자로 사용하여 선택한 데이터로 설정하면 다음 내용을 청취할 수 있습니다.paste이벤트 후 (임의 딜리미터로) split 값을 selected-values 배열에 추가합니다.
https://codepen.io/anon/pen/bKEQZY

언급URL : https://stackoverflow.com/questions/50679550/vuetify-tags-with-chips-using-instead-of-hitting-enter

반응형