newsource

입력 상자 문자열이 상자 크기보다 길면 Vue Sortable + Draggable이 작동하지 않음 Sortable.js와 함께 Vue draggable을 사용하고 있습니다.목록의 항목을 끌어서 정렬할 수 있는 꽤 멋진 라이브러리입니다.그러나 입력 요소 목록이 있고 텍스트가 입력 상자보다 길면 해당 입력 상자가 드래그 앤 드롭되지 않습니다. 디버깅을 시도했지만 문제가 라이브러리 또는 일부 입력 상자 이벤트에서 발생한 것일 수 있으며 이를 수정하기 위해 재정의할 수 있는지 찾을 수 없었습니다. 예를 들면, 다음과 같습니다.https://jsfiddle.net/egmstvL7/ 아래가 잘렸다.좋은 생각 있어요? var app = new Vue({ el: '#app', data: { myArray:["This..

행/하위 구조를 사용한 루프 저는 이 문제에 점점 더 자주 직면하게 되고 이에 대한 간단한 해결책이 없을까 고민하고 있습니다.일련의 데이터를 열/자녀 구조로 바꾸려다 막혔어요 이게 내가 달성하려는 것이다. Data 1 Data 2 Data 3 ... 대부분의 경우 데이터 루프를 한 줄로 묶는 등의 작업을 마쳤습니다.하지만 더 맞춤화된 방식으로 데이터를 표시할 수 없었습니다.더 좋은 방법이 있을까요? {{ item.message }} 예를 들어, 3개의 아이템.메시지 후에 새로운 행이 생성되는 등?일반적으로는 계산된 값을 사용하여 원하는 방식으로 데이터를 그룹화한 다음 그룹화된 데이터를 반복합니다. console.clear() new Vue({ el: "#app", data:{ todos: [ {id: 1..

v-show 및 v-if가 어레이가 아닌 개체의 부울 변경에 즉시 응답하는 이유는 무엇입니까? 질문을 클릭하면 답변이 표시되는 동적 FAQ 페이지를 작성할 때 이 이상한 동작을 발견했습니다. 답변의 개폐를 제어하는 부울이 객체에 저장되면 보기가 즉시 업데이트되고 답변이 즉시 표시되거나 숨겨집니다.그러나 목록에 저장된 경우 보기가 다른 방법으로 업데이트될 때까지 답변이 표시되지 않거나 숨겨지지 않습니다. 다음은 문제를 표시하는 바이올린입니다.https://jsfiddle.net/masterofginseng/ffqt9n4y/6/ HTML This responds immediately {{ questionObj.question }} {{ questionObj.answer }} This doesn't respo..

'JSON.stringify'를 쓰면 Vue 구성 요소가 로드될 때 오류가 발생합니다. 플러그인을 Vue 플러그인을 든지 Vue 플러그인을 추가할 수 .JSON.stringify브라우저에 런타임 오류가 나타나 페이지가 공백이 됩니다.의 임의의 는 「」라고 쓴다.JSON.stringify하다 Uncaught TypeError: 개체 '#'의 읽기 전용 속성 'exports'에 할당할 수 없습니다. 컴포넌트에 직접 JSON.stringify를 쓰면(예를 들어 '작성된' 라이프 사이클 훅에서) 아무 일도 일어나지 않습니다. 는 웹 팩 중 웹팩 컴파일 중 브라우저 합니다.eval에러가 발생하는 행은 다음과 같습니다. eval("/* WEBPACK VAR INJECTION */(function(module) {O..

Vue2에서 동적 $refs 값을 가져오는 중 vue 어플리케이션 작업 중입니다.나는 역동성이 있다.ref수량을 받아들이는 입력 요소에 대한 바인딩 다음과 같은 - :ref="'qty' + index" 로그인을 할 때this.$refs모든 심판은 내가 맡지qty0, qty1, qty2 등입니다. 질문입니다. ref를 사용하여 특정 입력 요소의 값을 얻으려면 어떻게 해야 합니까? 하드코드를 할 수 없다this.$refs.qty0지수가 계속 변화하고 있습니다. 나는 노력했다. let quantityRef = 'qty' + index; console.log(index); // 0 console.log(quantityRef); // qty0 console.log(this.$refs.quantityRef); //..

Mocha를 사용한 Vuejs 테스트: 컴포넌트가 요소에 장착되지 않음 저는 VueJ를 사용하여 개발하거나 Mocha를 사용하여 테스트하는 것을 비교적 처음이며(머리 없이 사용) 모든 것을 이해하기 위해 일부러 vue-cli를 사용하지 않습니다.DOM에서 확인해야 할 정도까지 기능하는 유닛 테스트(페치 요구, 소품 가져오기/설정 등)가 있습니다.컴포넌트가 정상적으로 작성되고 있는 것처럼 보이지만 요소에 마운트되어 있지 않습니다. JSDom을 사용하여 헤드리스 테스트용 DOM 콘텍스트를 만들고 있습니다(내 _setup.js: global.Vue = require('vue/dist/vue'); require('jsdom-global')(''); 이러한 경우 $el은 정의되지 않습니다.단, 위에서 정의한 DO..

인트로 추가JS 라이브러리에서 Vue-Cli/Webpack 프로젝트로의 vue-cli와 웹 팩을 사용하여 첫 번째 프로젝트를 구축하고 있는데 외부 JavaScript 라이브러리를 프로젝트에 올바르게 사용하는 방법을 잘 모르겠습니다. Intro.js 라이브러리를 추가하고 싶습니다.이 라이브러리는 intro.js를 Import하고 HTML 요소에 태그를 추가하여 introJs().start() 함수를 호출하기만 하면 됩니다. 라이브러리를 설치했습니다.npm install introj.js --save 다음을 추가하여 라이브러리를 가져왔습니다.import introJS from 'intro.js'내 안에내 부분App.vue파일. 컴파일한 것을 확인했습니다.app.jsintroJS가 컴파일 되고 있는 것을 알고..

부모가 Vuejs에서 자식 방출 이벤트를 수신합니다. 부모 컴포넌트가 자녀 컴포넌트 송신 커스텀이벤트를 듣는 방법이 있나요? // -- child comp const addnewbtn = { template : 'Add New TaskAdd', data(){ return { taskname : '', form : false } }, methods : { showform(){ if( this.form ){ this.form = false; }else{ this.form = true; } }, addnewtask(){ this.$emit('add-task',this.taskname); } }, } // -- parent comp Vue.component('todolist',{ components : { ad..

Node.js 서버에 Vue.js 애플리케이션을 배포하는 방법 CSS, 폰트, JS 폴더 및 Dist 폴더가 있습니다.index.htmlVue.js에 대해 파일을 최소화하여 배포 및 사용할 수 있습니다.이 응용 프로그램을 실행하기 위해 Node.js를 사용합니다.어떻게 하면 특정 포트에 전개하도록 설정할 수 있습니까?이 Vue 앱을 실행하기 위해 특정 방식으로 빌드해야 하는지 또는 구성 방법을 알 수 없습니다.어떤 도움이라도 주시면 감사하겠습니다.Vue는 프런트 엔드 라이브러리일 뿐이므로 Vue를 호스트하고 자산을 서비스하는 가장 쉬운 방법은 미니 웹 서버를 시작하는 데 사용할 수 있는 간단한 Express 친화적인 스크립트를 작성하는 것입니다.Express에서 아직 읽지 않은 경우 빠르게 읽어 보십시오..

Vue의 클래스 구성 요소에 사용할 액세스 한정자를 선택하십시오. Vue 클래스의 속성 및 메서드에 대해 어떤 수식어를 사용해야 합니까?(사용하고 있습니다.vue-class-component패키지) public,private,protected? 또는 액세스 수식자를 설정할 필요가 있는 린터 규칙을 꺼야 합니까? 다음은 구성 요소의 예입니다. @Component({ components: { MyChildComponent } }) export default class MyComponent extends Vue { // props @Prop({ type: String, default: '' }) public readonly value!: string @Prop({ type: Array, default: () ..