기본 콘텐츠로 건너뛰기

라벨이 qselect인 게시물 표시

[2023-05-15] Quasar QSelect 옵션 설명

 안녕하세요. 클스 입니다. Quasar QSelect 옵션에 대한 설명을 하고자 합니다. 회사를 선택하거나, 여러 코드값을 선택할때 아래와 같은 화면이 필요합니다. 그리고 company_id 값으로 미리 선택되도록 해야 합니다. q-select 의 option 은 label, value 2개 속성이 기본 입니다.  물론 option-value = 'yyy' , option-label = "xxx" 이렇게 해서 커스텀 가능합니다. company_options: [ { label: 'Google' , value: 'Google-value' , description: 'Search engine' , category: '1' , },   소스를 보면 아래와 같이 사용하면 됩니다. 그런데  map-options , emit-value 2개 옵션을 잘 사용해야 원하는 값을 얻게 됩니다. < q-select filled v-model ="company_model" : options ="company_options" label = "Standard" map-options emit-value /> map-options 은 value 값으로 선택을 할 수 있게 하는 옵션입니다. emit-value 은 선택된 option의 value 값만 넘겨 줍니다. 앞에서 option을 object로 선언했기 때문에 map-option이 없으면 value 값이 화면에 표시됩니다. 아래 화면에서 보면 Apple-Value를 표시됩니다. 원하는건 Apple이 표시되길 원합니다. 이때 map-options 을 사용하면 value 값으로 매칭해서 Label을 출력해줍니다. 그리고 Object...