gigabyte

Vue JS - 입력 필드의 특수 문자를 제한하는 방법 Vue JS에서 텍스트 문자 제한을 구현하는 가장 좋은 방법은 무엇입니까? 사용자가 필드에 기호를 입력할 수 없도록 RegExp를 사용하는 방법을 찾고 있습니다.저는 두 가지 방법을 사용합니다. 첫 번째 방법은watch또는computedDaniel이 위에서 추천한 바와 같이 세터로 값을 매겨야 합니다.키보드 입력을 처리할 뿐만 아니라 드래그 앤 드롭, 붙여넣기 또는 사용자가 생각해낸 모든 것을 통해 입력을 처리할 수 있습니다. 두 번째는keydown핸들러watched 값만 사용하는 경우 UI에서 약간의 지연이 발생합니다.제한 문자는 삭제하기 전에 짧게 표시됩니다.보다 심리스한 사용자 경험을 실현하기 위해keydownlistener는 잘못된 입력에 대..

모바일 장치에서 네비게이션 바를 mini로 전환 이것은 Vue.js 프로젝트로 Vuetify를 사용하고 있습니다.내비게이션 서랍이 있어요.화면 폭 1263px에서 크기 조정 워처가 시작되고 드로어가 닫힙니다.'영구적'으로 예방할 수 있습니다.제가 원하는 것은 서랍 스위치를 미니로 닫지 않고 하는 것입니다. 여기 제 기존 코드가 있습니다. {{ item.icon }} {{ item.title }} {{ item.title }} https://codepen.io/jsd219/pen/gJJMPQ 아무쪼록 잘 부탁드립니다.고객님의, docs: computed: { mini() { switch (this.$vuetify.breakpoint.name) { case 'xs': return true case 'sm':..

Vue.js 및 jQuery? vue.js에서 jQuery를 사용할 수 있습니까?Vue 컴포넌트에 사용하고 싶은 기능이 있습니다.이 함수는 기본적으로 아이템을 안팎으로 슬라이드합니다만, 실장했을 때는, 그렇게 할 수 있지만 대부분의 경우 그럴 필요가 없습니다. Vue를 배우고 있다면 Vue를 생각하고 jQuery를 치워보세요.jQuery에서는 명령적인 방법으로 일을 처리하지만, 지금은 선언적인 방식으로 생각해야 합니다. DOM 를 직접 조작하지 말아 주세요.모든 DOM 조작은 Vue가 담당해야 합니다. 원하는 대로 Vue에게 말하면 됩니다. Vue는 전환을 제공하며, 이를 통해 jQuery를 전혀 사용하지 않고도 요건을 충족할 수 있습니다.처음에는 간단하지 않고 jQuery로 해결하고 싶다고 생각할지도 ..

Vue 앱이 VM을 사용할 때 이벤트 청취자에게 추가 매개 변수를 전달할 수 있는 방법은 무엇입니까?$once()? Vue 앱에서는 VM을 사용하여 한 번 호출된 이벤트 수신기를 추가할 수 있습니다.$1회. 예를 들어 Vue App의 하위 구성 요소에서는 다음을 사용하여 이벤트를 내보낼 수 있습니다.vm.$emit('myEvent', data)이벤트를 발생시킵니다. 그런 다음 이벤트 청취자를 이 이벤트에 추가하여 처리할 수 있습니다.vm.$onceVue 앱에 있습니다. 이 때 추가 데이터를 이벤트 핸들러에 전달하고 싶습니다. 나는 다음과 같이 시도했다.하지만 그것은 오류를 던진다. 수집되지 않은 참조 오류: $event가 정의되지 않았습니다. //In the Vueapp this.$refs.child.$..

Vue.js를 사용한 어레이 콘텐츠 및 반응성 문제 해결 몇 년 전만 해도 하는 것은 나쁜 습관이었다 array = []; 어레이가 어딘가에서 참조되고 있는 경우는, 그 참조가 갱신되어 있지 않기 때문입니다. 올바른 방법은array.length = 0; 어쨌든 JavaScript는 업데이트 되었고 Vue.js라는 프레임워크가 있습니다. Vue가 잡히지 않음array.length = 0;반응하지 않게 하려고요하지만 잡히긴 하죠array = []; 사용할 수 있습니까?array = [];아니면 아직 JavaScript가 고장났나요?뭐랄까...myArray.splice(0)는 어레이의 내용을 클리어하고, 그 내용도 반응합니다. Vue.config.devtools = false; Vue.config.produc..

화면 크기를 확대하기 위해 Vuetify 그리드 열 너비를 줄이는 방법 사용하고 있다vuetify그리드 시스템을 사용하여 응답 구성요소를 구축합니다.아이콘과 응답 열에 대한 열 비율이 각각 1:11입니다.아래는 그 코드입니다. mdi-thumb-up {{ likes }} {{ reply }} 이것은 작은 화면에서는 괜찮아 보인다.하지만 화면 크기가 1100px가 넘으면cols="1"아래 그림과 같이 아이콘 열과 응답 열 사이에 공간이 너무 넓어집니다. 수정 방법v-col필요 이상으로 폭이 넓어졌습니까?이 이상은 안 된다는 거 알아1위해서cols소유물.어떻게 대처하고 계셨나요?사용할 수 있습니다.cols="auto"열을 내용 너비로 만들고 나머지 너비를 늘릴 수 있도록 다른 열에 cols 속성을 지정하지 ..

슬롯이 있는 동적 컴포넌트 부모 컴포넌트의 동적 컴포넌트에서 명명된 슬롯을 사용하려면 어떻게 해야 합니까? 슬라이더 컴포넌트는 다음과 같은 동적 슬라이드 컴포넌트를 사용합니다. 각 슬라이드에는, 슬라이더로 사용하는 컨텐츠가 있는 슬롯이 있습니다. Slide 1 Main Slide 1 Meta 슬라이더는 다음과 같은 슬롯을 사용합니다. 그렇지만는 내부 내용을 무시하기 때문에 슬롯은 무시됩니다. 예: https://codepen.io/anon/pen/WZjENK?editors=1010 이것이 불가능할 경우 슬라이드 컴포넌트에서 HTML 콘텐츠를 가져오는 슬라이더를 만들 수 있는 다른 방법이 있습니까?메인/메타 섹션을 자체 구성요소로 분할하면 렌더링 기능을 비교적 쉽게 사용하여 원하는 섹션으로 분할할 수 있습..

스크롤 스파이 드롭다운이 아무것도 감시하지 않을 때 기본 텍스트로 업데이트하는 방법이 있습니까? Vue는 처음이고 Bootstrap Vue Scrollspy(https://bootstrap-vue.org/docs/directives/scrollspy#example-using-navs)를 사용하고 있습니다.드롭다운은 스틱이며 참조되는 모든 콘텐츠를 감시하고 있습니다.스틱 드롭다운에는 현재 섹션으로 갱신되는 텍스트가 있습니다. https://codesandbox.io/s/festive-tree-1w3hx?file=/src/App.vue와 같은 코드입니다. 위의 링크에서 "Contents"와 같이 드롭다운 텍스트를 기본 텍스트로 설정할 수 있는 방법이 있습니까?스크롤스피잉이 완료될 때마다 드롭다운 텍스트가 기..

"$attrs is read only", "$listeners is read only", "프로포트를 직접 변환하지 마십시오." 나는 Vue에 처음입니다.왼쪽 메뉴에 친구 목록이 표시되고 본문에 채팅 상자가 표시되는 채팅 앱을 개발하려고 합니다.친구 아이디를 기반으로 Ajax 콜과 채팅창으로 라우팅하여 친구 목록을 로드하고 있습니다.여기 코드 샘플이 있습니다. 채팅 목록 구성 요소가 서버에서 친구 목록을 로드합니다.여기 제 app.js 파일입니다. Vue.use(VueRouter) const router = new VueRouter({ routes, linkActiveClass: "active" }); import ChatComponent from './components/ChatComponent'; c..

Vuex 개체를 비울 때 Vue 프로젝트에서 정의되지 않은 오류를 방지하려면 어떻게 해야 합니까? 예.나는 가지고 있다user템플릿에서 다음과 같이 사용하는 Vuex 데이터: // Inside