prostudy

vue-properties가 중첩된 경로에 템플릿을 렌더링하지 않음 그래서 나는 다음과 같은 경로를 가지고 있다. const routes = [{ path: '/', component: Home, children: [ { path: "/health" children: [ { path: 'overview' component: Overview }, { path: 'blood', component: Blood } ] } ] }] 홈 컴포넌트에는 다음과 같은 것이 있다. 하지만 내가 그 곳으로 갈 때/health/overview그리고/health/blood구성 요소에 해당하는 템플릿은 렌더링되지 않는다.나는 앱을 확인했다.$route물체는 경로와 구성 요소를 정확하게 감지한다.템플릿만으로는 렌더링되지 않는다.나..

Vue.js에서 클릭 이벤트를 동적으로 삽입할 수 있는 방법이 있는가? 모바일 뷰포트에만 의존하는 요소에 일부 계산 방법을 삽입하는 것을 목표로 한다.여기 내가 작업하고 있는 것의 기본적인 요지가 있다. {{t.title}} 계산된 기능을 동적으로 삽입할 수 있도록 크기 조정 이벤트를 사용하여 브라우저 너비를 결정하려고 함꼬리표를 달다Karthikeyan이 명시한 두 가지 요소(데스크톱용 하나와 모바일용 하나)를 제공하거나 클릭 이벤트를 조건부로 해당 요소에 추가할 수 있다. v-on="isMobileView ? { mouseover: onTopicClicked($event, m, t) } : {}" 보기가 모바일인지 아닌지를 나타내는 데이터를 추가하고 v-if , v-else 및 @click만 v-if..

부에 있는 원소들.JS 전환 그룹이 이동 중에 제대로 애니메이션화되지 않음 나는 Vue.js 2에서 애니메이션과 함께 안드로이드의 토스트 스타일의 컴포넌트를 구현하려고 한다.전환에 필요한 css는 다음과 같다. .toast-enter-active { opacity: 0; transition: all 1s ease-out; } .toast-enter-to { opacity: 1; } .toast-leave { opacity: 1; transition: all .7s ease-out; } .toast-leave-to { opacity: 0; } 그toast-enter전환이 좋아 보인다 - 목록이 위로 이동하고 요소가 희미해지지만 요소가 제거되면 어떤 이유로 제거될 요소가 아래로 점프한 다음 페이드 아웃된다...

하위 구성 요소 내에서 props.value 수정 나는 Vue를 처음 접하고 "dropdown" 구성요소를 만들려고 한다.다음과 같은 상위 구성 요소에서 사용: 어디에selection로 저장된다.data사용자의 선택을 반영하도록 업데이트해야 한다.이렇게 하려면 내 드롭다운 구성 요소에value소포와 소포가 필요하다.input선택 사항이 변경될 때 이벤트 하지만, 나는 또한 수정하기를 원한다.value아이 자체 내에서, 스스로 드롭 다운 컴포넌트를 사용할 수 있기를 원하기 때문에(그렇지 않으면 UI는 스스로 사용할 경우 새로 선택한 값을 반영하도록 업데이트되지 않기 때문에 수정할 필요가 있다.) 내가 묶을 수 있는 방법이 있을까?v-model위와 같이, 그러나 또한 아이 내부에서 값을 수정한다(그 이유는 ..

Quill 편집기 + VueJS2 이미지 업로드:URL에 대한 Base64 이미지 여기서 편집기 사용: https://github.com/surmon-china/vue-quill-editor Quill 편집기에서 MySQL 데이터베이스에 이미지를 저장하려고 하는데 base64의 큰 이미지가 너무 길어서 삽입할 수 없다. 서버에 이미지를 자동 업로드하고 서버가 이미지 URL을 반환하도록 사용자 지정 이미지 핸들러를 쓰려고 했는데, 이제 막혔다. 현재 HTML: 다음과 같은 편집기에 이미지 처리기 추가: onEditorReady(editor) { editor.getModule('toolbar').addHandler('image', this.imageHandler); console.log('editor rea..

Vue.js는 v-for와 함께 구성 요소를 다시 렌더링하지 않음 나는 다중 텍스트 입력 구성요소를 만들려고 한다.개별 필드를 관리하는 상위 Vue 구성 요소와 단일 입력에 대한 구성 요소가 있다. 상위 구성 요소는 개체 배열에 바인딩된 v-for를 통해 하위 구성 요소를 렌더링한다. data() { return { lastItemId: 0, items: [{ id: this.lastItemId, value: '', showDeleteBtn: false}] } }, 템플릿: 사용자가 목록의 마지막 필드에 입력을 시작할 때마다 나는 이벤트 뒤에 새 텍스트 필드를 추가하기 위해 이벤트를 내보내고 있다. addItemAfter(index) { if (index == this.items.length - 1) {..

Vuejs - 정의되지 않은 속성 '_withTask'을(를) 읽을 수 없음 버튼을 누른 후 div에 새로운 html을 추가하려고 한다.v-for. 그러나 버튼을 누르면 이 오류가 발생하고 요소(기사)가 디브에 한 번 추가되지만 그 후에는 더 이상 작동하지 않는다. vue.js?3de6:1743 TypeError: 정의되지 않은 속성 '_withTask'을(를) 읽을 수 없음 remove$2(평가 대상(app.js:561), :7078:13) updateListeners에서 평가(app.js:561):2067:7) Array.update에서DOMListeners(평가 대상(app.js:561),:7091:3) patchVnode에서 평가(app.js:561), :5918:62) updateChilds(평..

사용자 지정 구성 요소에 사용할 경우 v-model과 .sync의 차이점 구성 요소에 사용되는 v-model과 .sync의 차이점을 이해할 수 없다. V-모델은 변수(myVar)를 구성요소 속성 '값'에 바인딩하고 구성 요소에서 방출되는 '입력' 이벤트를 청취하여 변수 'myVar'를 업데이트하기 위한 속기다. .sync는 변수(myVar)를 구성 요소 속성에 바인딩하고(이 경우 prop1') 구성 요소에서 방출되는 'update:prop1' 이벤트를 청취하여 'myVar' 변수를 업데이트하기 위한 속기다. 기본적으로 v-model은 '값' 속성 및 '입력' 이벤트와만 작동하지만 그마저도 구성 요소의 '모델' 옵션을 사용하여 사용자 지정할 수 있다는 것을 알고 있다. 누군가 나에게 차이점이나 언제 무엇을..

Mac에서 codekit을 사용하여 Vue JS 프로젝트를 설정하는 방법 안녕 나는 CLI를 처음 접하는 사람인데 어떻게 내 Mac에 있는 Codekit으로 vue js 프로젝트를 설정하지? 고마워요.알다시피 VueJS와 Codekit에 관한 언급은 많지 않다.Vue 프로젝트의 관점에서, Vue-cli는 좋은 방법이다(Vue에 새로 온 사람들에게는 조금 진보된 것일 수 있다).>>에서 바로 구워지는 자동화된 워크플로우(전송, 번들링 등)가 있는 템플릿 몇 개를 선택할 수 있다. 만약 당신이 실행하면서 땅을 치고 싶다면, 당신은 당신의 index.html 파일에 있는 VueJS 라이브러리를 간단히 참조할 수 있다.이 unpkg 링크는 도서관의 최신 버전을 제공해 줄 것이다.이게 도움이 되길 바래.네 마음에..

값을 vue 인스턴스에 전달하는 방법? 웹 구성 요소에서 vue 인스턴스에 값을 전달하고, rails html.erb 파일을 사용하려는 경우, vue 인스턴스를 마운트하는 요소: vue 인스턴스에 전달하지만 작동하지 않는 것 같으며, vue 인스턴스는 에서 선언됨main.js다음과 같은 경우: export default new Vue({ store, vuetify, render: h => h(App), data: { purchaseId: null }, methods: { setJson(payload) { console.log("payload", payload); this.purchaseId = payload; } } }).$mount("#app"); 이 후 아동용 부품으로 전달하고 싶은데, 누가 어떻게 ..