반응형

vuejs2 417

svg fill Atribute의 vue.js 변수를 호출하려면 어떻게 해야 합니까?

svg fill Atribute의 vue.js 변수를 호출하려면 어떻게 해야 합니까? 백엔드에서 데이터를 가져와 vue.js를 사용하여 프런트엔드에 사용합니다.이 경우 vue 변수를 사용하여 SVG 채우기 속성을 변경합니다. 문제는 동작하지 않고 (소스 코드에) 다음과 같이 표시되는 것입니다. 대신: 내가 뭘 잘못하고 있지? 바이올린 : https://jsfiddle.net/cy5gevLy/ HTML: [% colorAttr() %] JavaScript: var color = new Vue({ el: '#colorHandler', methods:{ colorAttr:function(){ var my_color = '#fafafa'; return my_color } }, delimiters: ["[%","..

programing 2022.06.22

저장 및 취소 옵션을 사용하여 양식 편집

저장 및 취소 옵션을 사용하여 양식 편집 저는 VueJs에 처음 왔어요.간단한 저장 및 취소 기능이 있는 폼을 작성하려고 합니다.모델을 필드를 형성하기 위해 바인드할 때 입력이 변경되면 즉시 업데이트가 되지만, 그렇게 엄격한 바인딩을 원하지 않습니다.대신 저장 버튼을 누르면 저장 및 전송하고 취소 버튼을 누르면 변경 내용을 되돌릴 수 있습니다. Vue가 제안하는 방법은 무엇입니까? 또, 송신에 실패했을 경우는, 서버의 보존 상태를 표시해, 폼에 표시하는 것이 이상적입니다.당신이 알고 있는 예나 샘플이 있다면 큰 도움이 될 것입니다.감사합니다! JSFiddle 참조 First Name: Last Name: {{ isEditing ? 'Save' : 'Edit' }} Cancel 몇 가지 방법이 있습니다.양..

programing 2022.06.22

vue-multicelect에 대한 쓰기 단위 테스트

vue-multicelect에 대한 쓰기 단위 테스트 vue-multicelect 테스트 작성 방법을 알아보고 있는데 문제가 있습니다. 특히, (옵션을 선택하기 전에) 드롭다운을 열기 위해 입력을 "클릭"하려고 합니다만, 아무것도 동작하지 않습니다. 노력했어 vm.$el.querySelector('.multiselect').click() 브라우저: document.querySelector('.multiselect').click() 다른 조합들도 많은데 아무 것도 안 돼요. 유닛 테스트에서 사용하는 방법에 대해 문서를 제공하지 않는 것이 테스트 범위임을 강조하는 라이브러리로서는 이상합니다.마침내 이 일을 해냈다, 열쇠는.dispatchEvent(new window.Event('focus'))것은 아니다....

programing 2022.06.22

긴 요소 목록에서 작은 변경 하나에 대해 렌더링 시간을 단축할 수 있는 방법이 있습니까?

긴 요소 목록에서 작은 변경 하나에 대해 렌더링 시간을 단축할 수 있는 방법이 있습니까? 아래에 링크되어 있는 예시는 div의 그리드(1,000 x 20)의 매우 큰 목록을 나타내고 있으며, 하나의 div를 클릭하면 해당 요소만 강조 표시됩니다.단, VueJs의 리렌더링에 따른 오버헤드가 큰 것 같습니다.클릭 시 지연이 발생합니다. Value: {{column['value']}} 코드펜의 예시물론 모든 업데이트에 대해 평가가 필요한 작업을 수행하지 않음으로써 속도를 높일 수 있습니다.고객님의 경우class설정은 매번 모든 상자에 대해 함수를 호출해야 합니다.row또는column변화들. 추가했습니다.style컬럼의 구성원으로서 강조 표시 시 각 셀이 변화를 알아차릴 것을 요구하는 대신 직접 찾을 수 있도록..

programing 2022.06.22

Vue는 vue 1에서 vue 2로의 이행을 필터링합니다.

Vue는 vue 1에서 vue 2로의 이행을 필터링합니다. vue 1에서 vue 2로 필터를 마이그레이션하는 데 문제가 있어 여기서 필요한 내용을 작성했습니다(입력 텍스트와 일치하는 텍스트 강조 표시). Vue.component('demo-grid', { template: '#grid-template', props: { filterKey: String }, data: function () { return { searchParams: [ { key: '' } ], suggestions: [ { message: 'Foo' }, { message: 'Bar' }, { message: 'Foobar' }, { message: 'pikachu' }, { message: 'raichu' } ] } }, filter..

programing 2022.06.22

vue.js 2 앱에서 커스텀 데코레이터를 글로벌하게 사용하려면 어떻게 해야 합니까?

vue.js 2 앱에서 커스텀 데코레이터를 글로벌하게 사용하려면 어떻게 해야 합니까? 전달된 메서드에 인수를 추가하는 타이프스크립트 데코레이터를 만들었습니다.옵션 파라미터를 사용하여 데코레이터 없이도 완벽하게 동작합니다.대부분의 경우 이들 파라미터를 전달할 필요는 없지만 가끔 이들 파라미터를 전달할 필요가 있습니다. 그러나 다른 개발자는 이 메서드의 구현이나 jsdoc을 보지 않는 한 전달해야 할 다른 주장이 무엇인지 알 수 있습니다. 그래서 올바른 순서로 파라미터를 추가할 수 있는 데코레이터를 만들었습니다.모든 것이 정상 작동하지만, 이제 모두가 MyDecorator에 Import를 추가해야 한다는 것을 기억해야 합니다.그래서 저는 이 데코레이터를 전 세계에 보급하고 싶습니다. 또한 앱에서는 컴포넌트,..

programing 2022.06.22

Vuejs 구성 API의 Ref() 유형 오류를 해결하는 방법

Vuejs 구성 API의 Ref() 유형 오류를 해결하는 방법 vue composition API를 사용하고 있으며 각 객체에 값 속성이 있는 객체의 배열에 대해 ref를 사용하고 있습니다.각 배열의 속성 값과 typescript가 ref의 값을 혼동하고 있는 것 같습니다. 위 그림과 같이 ar의 종류를 알려주는 typescript는 이름과 값을 포함한 오브젝트 배열이지만 ref를 사용하면 잘못된 type이 검출됩니다.아래와 같은 변환으로 사용해도 문제가 해결되지 않습니다. const arr2 = ref(arr as { name: string; value: number }[]); 그러나 값 속성을 값 2 또는 다른 값으로 변경하면 다음과 같이 작동합니다. 업데이트: 여기 내가 오늘 직면한 또 다른 문제가..

programing 2022.06.21

Vue.js에서 CKEditor 높이를 설정합니다.

Vue.js에서 CKEditor 높이를 설정합니다. 이 질문에는 이미 답변이 있습니다. CKEditor 5(클래식 에디터)의 높이 설정 방법 (24 회답) 닫힘3년 전. 시험삼아 해봤는데ckeditor5Vue.js에서 높이를 수동으로 설정할 수 없는 문제가 발생했습니다.다음은 제 코드입니다.잘못하고 있는 것이 있으면 알려주세요. data() { return { editor: Editor, editorData: '', editorConfig: { height: '500px' } } Classic Editor(CKEditor 5)는 편집 영역을 에 캡슐화하지 않기 때문에 편집 영역의 높이(및 이와 유사한 옵션)를 CSS로 쉽게 제어할 수 있습니다.예를 들어 다음과 같이 높이를 설정할 수 있습니다. 또는 .c..

programing 2022.06.21

webpack vuejs를 통해 이메일 보내기

webpack vuejs를 통해 이메일 보내기 저는 vuejs2의 초보자이며, 간단한 연락처 폼(webpack과 vuejs2 사용)을 작성하려고 합니다. 다음 방법을 가리키는 보내기 버튼으로 폼을 만들었습니다. Send 방법은 다음과 같습니다. methods: { sendemail () { var mailgun = require('mailgun.js') var mg = mailgun.client({username: 'MYUSERNAME', key: MYAPIKEY}) mg.messages.create('MYDOMAIN', { from: 'FROMEMAIL', to: ['TOEMAIL'], subject: 'SUBJECT', text: 'TEXT' }) .then(msg => console.log(msg)..

programing 2022.06.21

드래그 가능한 Vuetify 확장 패널

드래그 가능한 Vuetify 확장 패널 저는 Vuejs에 처음 와서 Vuetify를 하고 stackoverflow도 합니다.나는 끌 수 있는 확장 패널을 vuetify로 만드는 작업을 받았다.나는 많은 노력을 했지만 아무 것도 잘 되지 않았다.다음은 제가 팔로우한 몇 가지 문제점과 github 소스 코드입니다. 1) https://github.com/SortableJS/Vue.Draggable 2) 기능성 Vuejs 2 정렬 가능한 v-expansion-panels - 구글 검색 부탁드립니다 하지만 난 아무 것도 잘 되지 않았어.누가 나 좀 도와줄래?내가 참조할 수 있는 만지작거리나 코드펜은? 이 vuetify와 vue.js를 cdn으로만 사용하여 컴포넌트를 Import할 수 없습니다. 잘 부탁드립니다...

programing 2022.06.21
반응형