반응형

vuetify 31

VueJ의 구성 요소 템플릿에서 Vuetify 대화 상자 열기s

VueJ의 구성 요소 템플릿에서 Vuetify 대화 상자 열기s VueJS Vuetify 프레임워크를 사용하고 있는데 다른 템플릿에서 구성 요소 템플릿으로 가져오는 대화 상자를 열어야 해.App.vue의 Menu 버튼을 클릭하면 Modal이 열려야 한다.다음은 내 설정이다. App.vue = 메뉴 단추가 있는 탐색 템플릿 Modal.vue = modal 템플릿, main.js에서 전역으로 가져오기 main.js. import Modal from './components/Modal.vue' Vue.component('modal', Modal) Modal.vue 템플릿: Open Dialog Use Google's location service? Let Google help apps determine loc..

programing 2022.04.09

VueJ의 구성 요소 템플릿에서 Vuetify 대화 상자 열기s

VueJ의 구성 요소 템플릿에서 Vuetify 대화 상자 열기s VueJS Vuetify 프레임워크를 사용하고 있는데 다른 템플릿에서 구성 요소 템플릿으로 가져오는 대화 상자를 열어야 해.App.vue의 Menu 버튼을 클릭하면 Modal이 열려야 한다.다음은 내 설정이다. App.vue = 메뉴 단추가 있는 탐색 템플릿 Modal.vue = modal 템플릿, main.js에서 전역으로 가져오기 main.js. import Modal from './components/Modal.vue' Vue.component('modal', Modal) Modal.vue 템플릿: Open Dialog Use Google's location service? Let Google help apps determine loc..

programing 2022.04.08

Vuetify에서 사용자 지정 테마를 사용하고 색 변수를 구성 요소에 전달

Vuetify에서 사용자 지정 테마를 사용하고 색 변수를 구성 요소에 전달 나의index.js파일 수동으로 Vuetify를 재정의함theme회사 색상으로 반대: Vue.use(Vuetify, { theme: { primary: '#377ef9', secondary: '#1b3e70', accent: '#ff643d', error: '#ff643d' ... } 이제 내 템플릿에서 다음과 같은 색상을 사용할 수 있다. 내가 쫓는 건 그 기계를 사용하는 거야primary또는 의 다른 변수theme위에서 정의한 객체, 내 템플릿 스타일 내부: 스타일 섹션에 내 색의 육각값만 쉽게 쓸 수 있지만, 나는 내 자신을 반복하고 싶지 않고 오히려 내 것을 사용하고 싶다.theme그래서 내가 모든 곳에서 쉽게 색을 바꿀 ..

programing 2022.04.07

Vue 앱(Vuetify.js 포함)에서 검증이 포함된 간단한 양식을 구현하는 방법

Vue 앱(Vuetify.js 포함)에서 검증이 포함된 간단한 양식을 구현하는 방법 나는 Vuetify.js 예제를 사용하여 Vue.js로 구축된 웹사이트에 간단한 유효성 검사를 포함한 연락처 양식을 추가하려고 한다.나는 신참이라서 Vue 컴포넌트에서는 어떻게 구현해야 할지 잘 모르겠어. 나는 간단한 클라이언트 쪽 폼 검증을 달성해서 https://getform.org/ 폼으로 작동하게 하고 싶다. 업데이트됨: 코드 | 연락처.부에를 하다 (Vuetify.js 폼 예에서 추출) submit 스크립트 단 하나의 양식을 사용하여 작동 가능: submit 각본을 뜨다 잊지 마십시오. 추가하려면name특성겟폼은 그들을 필요로 한다. const app = new Vue({ el:'#app', data:{ erro..

programing 2022.04.06

초기 v-선택 값 설정

초기 v-선택 값 설정 누군가 에 대한 기본값을 설정하는 것을 도와줄 수 있는가?v-select주의할 점은 그것이 나의 것이다.v-select사물이 가득 차 있어 내 생각엔 내 물건을item-value원하는 초기 값이 작동하지 않음: Vue.use(Vuetify); const vm = new Vue({ el: "#app", data: { defaultSelected: { name: "John", last: "Doe" }, people: [ { name: "Harry", last: "Potter" }, { name: "George", last: "Bush" } ] } }); 예상: 초기v-select그래야 한다John 실제: 초기v-select비어 있다.참고할 만한 건 여기 있다. https://jsfid..

programing 2022.04.06

Vuetify: 색이 표시되지 않음

Vuetify: 색이 표시되지 않음 기존 Vue 프로젝트에 Vuetify를 통합하려고 하는데 색상이 제대로 나타나지 않고 있어.나는 https://vuetifyjs.com/en/getting-started/quick-start -> 기존 어플리케이션의 가이드를 따라가고 있다. css 파일은 버튼이 그림자로 강조된 듯하고 클릭 효과가 있어 왠지 올바르게 로드된 것 같다.그러나 색상과 텍스트가 올바르게 표시되지 않음: my main.js import Vue from "vue"; import App from "./App"; import Vuetify from "vuetify"; import router from "./router"; import "../node_modules/vuetify/dist/vuetif..

programing 2022.04.05

라우터 링크와 vue 및 vuetify 혼동

라우터 링크와 vue 및 vuetify 혼동 미리 정의된 템플릿을 사용하여 vue-roouter를 사용하는 방법: https://vuetifyjs.com/examples/layouts/google-contacts 내 항목 개체에 링크를 추가했음 items: [{ icon: 'dashboard' text: 'Home', link: '/'}, { icon: 'dashboard' text: 'Account', link: '/account'}, 라우터 링크 구성요소를 어디에 두어야 할지 혼란스럽다.v-list-tile v-btn그리고v-card모두 확장하다router-link, 그래서 당신은 어떤 것을 사용할 수 있다.router-link대신 해당 구성요소에 직접 속성이 제공. 당신의 경우 당신은 그냥 사용할 ..

programing 2022.04.05

ESC 키를 누르면 대화 상자 닫기

ESC 키를 누르면 대화 상자 닫기 사용자가 키보드의 ESC 키를 누를 때 활성화기 없이 열린 뷰에티파이 대화 상자를 닫으려면 어떻게 해야 하는가?추가하다@keydown.esc="dialog = false"로v-dialog구성 요소 data: () => ({ dialog: false }), 작업 예: https://codepen.io/anon/pen/BJOOOQ 또한 대화 상자를 사용자 정의 구성요소로 사용할 경우 입력 이벤트를 내보내야 한다. ... 이것만이 내가 그것을 작동시킬 수 있는 유일한 방법이다. mounted() { // Close modal with 'esc' key document.addEventListener("keydown", (e) => { if (e.keyCode == 27) { ..

programing 2022.04.03

Vuetify 버튼의 텍스트 색상을 변경하는 방법

Vuetify 버튼의 텍스트 색상을 변경하는 방법 뭔가 분명한 것을 놓치고 있는 건지도 모르지만, 텍스트 색상을 바꾸는 적절한 방법을 알 수가 없다.v-btn. 이것은 효과가 있지만, 사용해야만 한다.!important이상적으로 보이지 않음: .v-btn color: red !important 그color소품은 내가 아는 한 배경색에 불과하다.그리고 전화할 때 1차/2차 테마를 바꿀 수 있을 것 같다.Vue.use(Vuetify, { theme: {...}} )하지만 단일 구성 요소를 재정의하려면 어떻게 해야 하는가?텍스트 색칠을 위한 css 수업은 어디서나 가능하며, 추가만 하면 된다.--text색채에 예를 들어 테마에 정의된 색상으로도 작동해야 한다(예: primary--text그리고 유사하다. 이는..

programing 2022.04.03

Vuejs v-select에서 개체의 속성에 액세스하는 방법

Vuejs v-select에서 개체의 속성에 액세스하는 방법 나의 사용 케이스. 백엔드 api에서 여러 개의 개체를 받았어. 나는 그 물건들을 렌더링 하기를 원한다.v-select 이건 내 암호야 하지만 그것은 나에게 결과물을 준다. 하지만 객체 이름 속성이 v-select 우리는 바닐라 부에즈로 이것을 할 것이다. {{cat.name}} 하지만 여기서 부시는 우리가 할 수 없다. :items="categories.name" Vuetify 설명서 객체 배열 또는 문자열 배열일 수 있음.객체를 사용할 때 텍스트 및 값 필드를 찾으십시오.이것은 아이템 텍스트와 아이템 가치 소품을 사용하여 변경할 수 있다. 그들이 실제로 무엇을 의미하는지item-text그리고item-value다음을 사용하여 이 작업을 수행하..

programing 2022.04.02
반응형