안녕하세요. 클스 입니다. Quasar는 정말 vue3로 구현된 좋은 프레임워크 입니다.  아직 사용자가 많지 않아서 레퍼런스가 별로 없다는 것이 문제긴 합니다. 파일 업로더가 있는데 파일을 Drag & Drop 하면 서버에 올려줍니다. 물론 서버 rest api 가 있어야 합니다. https://quasar.dev/vue-components/uploader 그런데 메뉴얼 대로 했는데, 계속 오류가 납니다. 422 (Unprocessable Entity) performUpload @ quasar.esm.js:36051 runFactory 서버로 multi-part로 파일들을 보내는데, 서버쪽에서 files를 못받아서 문제 입니다. RESTAPI 서버는 아래 오류를 계속 발생 시킵니다. swagger로 하면 문제없이 동작 합니다. INFO:     127.0.0.1:59040 - "POST /api/upload/files HTTP/1.1" 422 Unprocessable Entity fiileupload.py @router.post( "/upload/files" ) async def create_upload_files( files : list[UploadFile]): for file in files: contents = await file.read() with open(os.path.join(UPLOAD_DIR, file.filename), "wb" ) as fp: fp.write(contents) print(file.filename) return { "filenames" : [file.filename for file in files]} fileupload.vue < template > < q-page class = "bg-light-green window-...

안녕하세요. 클스 입니다. Child.vue --> Parent.vue 와  데이터를 주고받을 때, emit을 사용합니다. 그런데 아래와 같은 오류가 발생합니다. Warning "Extraneous non-emits event listeners" shows up even when emits is set declare it using the "emits" option. 해결 방법1) Parent.vue 에서 root 로 div를 감싸주는 된다. 그런데 UI 가 깨지는 문제가 발생한다. <template>      <div>  : 추가       .... 여러가지 컴포넌트 들....     <MenuComponent msg="string input" @testChange="testChange" />    </div>    : 추가 </template> Child.vue 에서 아래와 같이 보내준다. <script lang="ts"> ... methods: { emit TestChange ( val ) { this .$emit( ' testChange ' , val ); }, </script> 해결 방법2)  Child.vue에 emits 를 추가해준다. Parent.vue 에서 root 로 div를 감싸주는 된다. 그런데 UI 가 깨지는 문제가 발생한다. <template>        .... 여러가지 컴포넌트 들....     <MenuComponent msg="string input"  @testChange="testChange" /> </template> Child.vue 에서 아래와 같이 보내준다. <script lang...

 안녕하세요. 클스 입니다. 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...