반응형
VueJS - 커스텀 요소 등록 방법 , , ,
저는 VueJs에 처음 왔어요.vuetify/webpack-ssr 템플릿을 사용하여 프로젝트를 작성했습니다.로그인 페이지를 작성하려고 합니다만, 폼이 표시되지 않고 콘솔에 다음과 같은 정보가 표시됩니다.
[Vue warn]: Unknown custom element: <v-form> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
[Vue warn]: Unknown custom element: <v-text-field> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
[Vue warn]: Unknown custom element: <v-select> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
[Vue warn]: Unknown custom element: <v-checkbox> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
로그인 폼에서 이러한 요소를 사용하고 있습니다.이러한 항목을 제외한 다른 Vue 요소는 완벽하게 작동합니다.이러한 요소를 등록하려면 어떻게 해야 합니까?
이게 제 메인입니다.js:
import Vue from 'vue'
import {
Vuetify,
VApp,
VNavigationDrawer,
VFooter,
VList,
VBtn,
VIcon,
VGrid,
VToolbar,
VCard,
transitions
} from 'vuetify'
import '../node_modules/vuetify/src/stylus/app.styl'
import App from './App.vue'
import Components from 'components/_index'
import { createStore } from 'store/index'
import { createRouter } from 'router/index'
import { sync } from 'vuex-router-sync'
Vue.use(Vuetify, {
components: {
VApp,
VNavigationDrawer,
VFooter,
VList,
VBtn,
VIcon,
VGrid,
VToolbar,
VCard,
transitions
},
theme: {
primary: '#ee44aa',
secondary: '#424242',
accent: '#82B1FF',
error: '#FF5252',
info: '#2196F3',
success: '#4CAF50',
warning: '#FFC107'
}
})
정말 감사합니다.
사용 중인 구성 요소를 가져오고 정의하지 않았으므로 경고로 표시됩니다.
아래와 같이 코드를 편집하면 모든 것이 정상적으로 동작합니다.
import Vue from 'vue'
import {
Vuetify,
VApp,
VForm,
VTextField,
VSelect,
VCheckbox,
VNavigationDrawer,
VFooter,
VList,
VBtn,
VIcon,
VGrid,
VToolbar,
VCard,
transitions
} from 'vuetify'
import '../node_modules/vuetify/src/stylus/app.styl'
import App from './App.vue'
import Components from 'components/_index'
import { createStore } from 'store/index'
import { createRouter } from 'router/index'
import { sync } from 'vuex-router-sync'
Vue.use(Vuetify, {
components: {
VApp,
VForm,
VTextField,
VSelect,
VCheckbox,
VNavigationDrawer,
VFooter,
VList,
VBtn,
VIcon,
VGrid,
VToolbar,
VCard,
transitions
},
theme: {
primary: '#ee44aa',
secondary: '#424242',
accent: '#82B1FF',
error: '#FF5252',
info: '#2196F3',
success: '#4CAF50',
warning: '#FFC107'
}
})
언급URL : https://stackoverflow.com/questions/54800912/vuejs-how-to-register-custom-elements-v-form-v-checkbox-v-select-v-t
반응형
'programing' 카테고리의 다른 글
| Python에서 파일 크기를 가져오고 있습니까? (0) | 2022.11.27 |
|---|---|
| PHP에서 신용카드를 검증하는 가장 좋은 방법은 무엇입니까? (0) | 2022.11.27 |
| MySQL - 왜 php MyAdmin이 매우 빠른 쿼리에서 매우 느린가? (0) | 2022.11.27 |
| MySQL 그룹 기준 및 기타 열의 합계 값 (0) | 2022.11.27 |
| lazy loading - 청크파일은 언제 다운로드됩니까? (0) | 2022.11.26 |