반응형

vuejs2 87

타입 스크립트에서 VueJ를 사용하는 방법

타입 스크립트에서 VueJ를 사용하는 방법 저는 Vue와 Typescript를 배우려고 합니다.그런데 제대로 세팅이 안 되는 것 같아요. app.ts 파일을 만들었습니다.코드의 행은 다음과 같습니다. import { Vue } from "../libs/vue/vue"; var app = new Vue({ el: "#app", data: { message: 'Hello Vue!' } }); 나는 이것이 다음과 같이 정리될 것이라고 생각했다. var app = new Vue({ el: '#app', data: { message: 'Hello Vue!' } }) 대신 TSC를 실행하면 오류가 많이 발생합니다.Vue 정의 파일을 빌드하려고 하는 것 같습니다. 그러면 어떻게 Vue 작업을 시작할 수 있을까요?도움..

itsource 2022.08.29

nuxt에서 vue-chartjs에서 이 오류가 발생하는 이유는 무엇입니까?

nuxt에서 vue-chartjs에서 이 오류가 발생하는 이유는 무엇입니까? vue-chartjs를 작동시키려고 하면 이 오류가 나타난다. WARN in ./node_modules/vue-chartjs/es/BaseCharts.js "export 'default' (imported as 'Chart') was not found in 'chart.js' 또한 devtools에서 다음을 수행합니다. TypeError: chart_js__WEBPACK_IMPORTED_MODULE_0__.default is not a constructor 재생성 절차: Nuxt 앱 만들기:$ yarn create nuxt-app vue-chartj 추가:$ yarn add vue-chartjs chart.js vue-chart..

itsource 2022.08.29

vue 프로젝트에서 blob 및 FileSaver.js를 사용하여 excel(.xlsx)을 다운로드하고 있습니다.

vue 프로젝트에서 blob 및 FileSaver.js를 사용하여 excel(.xlsx)을 다운로드하고 있습니다. Vue 프로젝트에서 API 요청을 전송하여 파일을 다운로드하려고 합니다.응답 데이터로 blob과 FileSaver.js를 사용하여 파일을 저장하려고 합니다. sendAjaxCall.then(response => { let file = new Blob([response.data], {type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'}) FileSaver.saveAs(file, 'Export2.xlsx') } 하지만 파일이 손상되어 파일을 열 수 없습니다. 이거 먹어봐 return Vue.axios.get(`api..

itsource 2022.08.29

VueJS 데이터 속성을 초기 값으로 재설정

VueJS 데이터 속성을 초기 값으로 재설정 전달된 구성 요소를 통해 초기 데이터 속성을 제공하는 구성 요소가 있습니다.prop데이터 변수에 저장됩니다. data() { return { localvar: this.propvar, localvar2: true } } 다음과 같은 방법으로 'reset' 버튼을 누르면 데이터 변수를 이 프로펠러 값으로 되돌릴 수 있습니다. methods: { reset() { Object.assign(this.$data, this.$options.data()); } } 문제는 데이터 변수가undefined프로포트의 가치를 참조할 때this.options.data(): console.log(this.$options.data()); => Object {localvar: undef..

itsource 2022.08.29

vuelidate를 사용하여 중첩된 개체를 검증할 때 오류 메시지를 vuetify로 표시

vuelidate를 사용하여 중첩된 개체를 검증할 때 오류 메시지를 vuetify로 표시 vuelidate를 사용하여 폼 입력을 확인하고 vuetifyjs를 사용하여 오류 메시지를 표시하고 있습니다.기본적인 오브젝트 검증을 실시해, 에러 메세지를 표시할 수 있었습니다. 그러나 수집을 검증할 때 오류 메시지를 표시하는 데 문제가 있습니다. 쟁점. 데이터 구조 예: contact: { websites: [ { url: 'http://www.something.com', label: 'Website', } ] } 검증 예: validations: { websites: { $each: { url: { url, } } }, } 샘플 템플릿: 계산된 오류 메시지의 예: websiteErrors() { console...

itsource 2022.08.28

Vuetify 데이터 테이블 작업 행

Vuetify 데이터 테이블 작업 행 페이지당 행과 페이지 네비게이션을 왼쪽 정렬하여 같은 줄에 버튼을 둘 수 있습니까? 작업 행은 기본적으로 오른쪽에 정렬됩니다.하지만 네가 원하는 것을 이룰 수 있는 방법은 있어.사용자 지정 페이지 번호를 사용하여 현재 페이지를 숨길 수 있습니다. 데이터 테이블 뒤에 이 항목을 추가합니다. test 자세한 것은 이쪽. 여기 행동 중인 코드펜이 있습니다.가장 쉬운 방법은 사용하는 데이터 테이블 슬롯에 버튼을 추가하여 테이블에 상대적으로 버튼을 배치하는 것입니다. test CSS에 의한 가장 간단한 방법: 데이터 테이블의 템플릿: Click me ! CSS: .my-grid .v-datatable__actions > div:first-child { flex: 1; } 작업..

itsource 2022.08.28

vue-apollo 클라이언트에서 GraphQL 입력 유형을 정의하는 방법

vue-apollo 클라이언트에서 GraphQL 입력 유형을 정의하는 방법 상황: laravel-graphql을 백엔드 GraphQL 서비스로, vue-apollo를 프런트엔드 클라이언트로 사용하고 있습니다. Vue 컴포넌트에는 다음과 같은 gql 쿼리가 있습니다(관계:A Song에는 더 많은 Song Parts가 있습니다. const getSong = gql` query FetchSong ($id:Int!){ song(id: $id) { id, name, authors_lyrics, authors_music song_parts{ type lyrics } } }`; 특정 노래를 업데이트하기 위해 사용하는 변환이 있습니다. const updateSong = gql` mutation updateSongMut..

itsource 2022.08.28

Vue/Bluebird: 콜백이 실행되지 않음

Vue/Bluebird: 콜백이 실행되지 않음 의 then()this.getStationsAsync()실행하지 않습니다.그catch()그렇지 않기 때문에 거부되는 것은 없을 것입니다.혹시 제가 잘못하고 있는 건 아닐까요?Promise.promisify(this.getStations)? 나도 해봤어this.getStationsAsync = Promise.promisify(this.getStations)내부created()훅. 에러는 안 나오지만, 아무것도 안 나오네요.console.logs()그 결과,then()실행했다. import Vue from 'vue' import axios from 'axios' import Promise from 'bluebird' methods:{ createStationMa..

itsource 2022.08.28

여러 요청 수행 Axios(Vue.js)

여러 요청 수행 Axios(Vue.js) 두 개의 비동시 요청을 수행하려고 하는데, 두 번째 요청을 수행하기 전에 첫 번째 요청의 데이터를 사용하고 싶습니다.첫 번째 요청에서 데이터를 가져온 후 두 번째 요청에 해당 데이터를 사용하려면 어떻게 해야 합니까? axios.get('/user/12345').then(response => this.arrayOne = response.data); axios.get('/user/12345/' + this.arrayOne.name + '/permissions').then(response => this.arrayTwo = response.data); 두 번째를 둥지로 옮기면 돼axios첫 번째 놈에게 전화해요 axios.get('/user/12345').then(res..

itsource 2022.08.28

Vue JS에서 v-for 루프 중에 로컬 변수 할당

Vue JS에서 v-for 루프 중에 로컬 변수 할당 기본적인 문제로 보이는 것에 대한 해결책을 찾는 데 어려움을 겪고 있어요. v-for 루프를 사용하여 일부 콘텐츠를 생성하는 템플릿이 있습니다. 이 콘텐츠 내에서 콘텐츠를 확인하는 기능을 실행해야 합니다.ID는 다른 목록의 ID와 일치합니다.일치하는 경우 해당 데이터를 가져와 루프에 표시해야 합니다. 현재 해당 데이터를 얻는 유일한 방법은 여러 번 확인하는 기능을 실행하는 것입니다. methods: { findClientName (clientId) { for (let name of this.clientList) { if (name.id == clientId) { return { name } } } } {{ findClientName(item.clien..

itsource 2022.08.28
반응형