반응형

Vuetify 49

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.03.18

전자 프로젝트를 최신 버전으로 업데이트한 후 "전자 보안 경고"가 표시되는 이유

전자 프로젝트를 최신 버전으로 업데이트한 후 "전자 보안 경고"가 표시되는 이유 나는 이 부에티파이의 보일러 판에서 일렉트로닉 부에즈 부에티파이 프로젝트를 만들었다. 콘솔에서 경고가 표시됨: Electron Security Warning This renderer process has Node.js integration enabled and attempted to load remote content. This exposes users of this app to severe security risks. For more information and help, consult https://electronjs.org/docs/tutorial/security 질문:. 노드, Vue.js, 웹 팩의 localhost..

Programing 2022.03.17

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.03.17

v-select에서 항목 텍스트 사용자 지정

v-select에서 항목 텍스트 사용자 지정 커스터마이징이 가능한지 알려줘item-text을 위해v-select? 의 각 항목을 사용자 지정v-select, 이와 비슷한 것: :item-text="item.name - item.description" Yes you can, usescoped slot문서에 기술된 바와 같이template. 을 위해v-select너는 두 개를 가지고 있다.scoped slot: selection: 방법 설명v-select선택 시 항목을 렌더링해야 함 item: 방법 설명v-select항목을 열 때 렌더링해야 함 이것은 다음과 같다: // Don't forget your props {{ data.item.name }} - {{ data.item.description }} {{..

Programing 2022.03.15

'v-built' 지시어는 어떤 수식어도 지원하지 않는다.

'v-built' 지시어는 어떤 수식어도 지원하지 않는다. 나는 vuetify의 datable을 사용하고 있다. 나는 아래와 같은 소품들을 가진 다른 슬롯을 가지고 있다. 나는 또한 오류/나쁜 코드/또는 위반을 확인하기 위해 vue의 eslint 플러그인을 사용하고 있지만, 만약 내가 내 파일에서 위의 코드 조각을 사용한다면 그것은 나에게 오류를 준다. 'v-built' 지시어는 어떤 수식어도 지원하지 않는다. 이 문서에 따르면 그것은 옳다. https://eslint.vuejs.org/rules/valid-v-slot.html 하지만 우리가 이 사건을 어떻게 처리했는지에 대한 어떠한 예도 가지고 있지 않다. 어떻게 면제를 하지 않고 이 경고를 제거할 수 있는가/또는 올바른 방법으로 만들 수 있는가? 고..

Programing 2022.03.15

Vuetify - 구성 요소 내부 CSS가 작동하지 않음(효과 발생)

Vuetify - 구성 요소 내부 CSS가 작동하지 않음(효과 발생) 사례 1 우리는 렌더링된 vuetify 요소에 사용자 정의 스타일을 적용하려고 한다. 그러나 아무런 변화도 없다. 사례 2 We are trying to style elements rendered by v-html (e.g. external html). For example, we try to apply custom width and height on the img, but it doesn't work: 이러한 요소에 사용자 정의 CSS를 적용하는 방법참고: 문서별로 스타일을 포함시키십시오. 또한 구성 요소가 파손된 경우 앱이 내부에 포장되어 있는지 확인하십시오.v-app태그: //.. 문서에는 다음이 명시되어 있다. 어플리케이션이 제..

Programing 2022.03.14

Vuetify에서 v-card 구성 요소의 중앙에 콘텐츠를 맞추는 방법

Vuetify에서 v-card 구성 요소의 중앙에 콘텐츠를 맞추는 방법 현재 제품에 포함되어 있다.vue, 나는 4개의 객체를 포함하는 productList의 배열을 가지고 있다.어레이를 반복해서 각 개체를 ProductsItem에 전달한다.부에 구성 요소그 구성 요소에서, 나는 부에티피로 카드를 만든다. 카드의 중앙에 내용물을 맞출 수 없다. 여기 내 코드, 내 카드의 스크린샷, 그리고 원하는 결과물이 있다. 상품들부에를 하다 Products ProductItem.부에를 하다 {{productItem.name}} {{productItem.description}} Add to Cart 업데이트: Vuetify 1.5 및 2 버전 모두에서 작동: 중앙 집중화하려면v-card-text내용은 단지 적용하기cl..

Programing 2022.03.13

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

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

Programing 2022.03.13

Vuetify에 특정 숫자 입력 구성 요소가 있는가?

Vuetify에 특정 숫자 입력 구성 요소가 있는가? 항목 양을 관리하는 요소 UI의 구성요소를 본 적이 있으며, 여기서 확인하십시오. https://element.eleme.io/#/en-US/구성 요소/입력 번호 나는 뷔에티파이에서 그런 것을 사용하고 싶지만 재료 디자인에서 비슷한 구성 요소나 비슷한 스타일의 예를 찾을 수 없다.그것을 이루기 위한 가장 좋은 방법은 무엇인가?예: 슬라이더 구성 요소 문서에서 작업 예를 확인하십시오.업데이트: 이 답은 Vuetify 버전 1과 관련이 있으며, Yukama Huksay의 답은 Vuetify의 새로운 버전에 대해 정확하다. 설정type의 탓으로 돌리다type="number"가는 길이다. 원본: 그냥 너만의 것을 만들면 된다. new Vue({ el: '#a..

Programing 2022.03.12

라우터 링크와 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.03.12
반응형