반응형

전체 글 550

Vuex 조건부(Lazy-loading) 스토어

Vuex 조건부(Lazy-loading) 스토어 Vue.js에 SPA를 구축하여 기록된 사용자의 문서와 대시보드를 관리하고 있습니다.다음과 같은 문제에 직면해 있습니다. 여러 모듈이 포함된 하나의 vuex 스토어가 있으며 다양한 작업을 관리합니다. 이러한 모듈 중 일부는 관리용입니다(새 대시보드 추가, 대시보드 편집...).여러 가지)가 있습니다. 최종 사용자 중 극히 일부만 관리 영역에 액세스할 수 있으므로 admins vuex 모듈을 사용합니다. 모든 사용자에 대해 관리 스토어와 상태를 갖는 것은 그다지 최적화되지 않은 것 같습니다.따라서 다음과 같은 질문입니다.Vuex 스토어에 모듈을 추가할 수 있는 아키텍처 방법은 조건(예를 들어 사용자가 관리자일 경우)에만 있습니까?사용자가 관리 인터페이스에 액..

programing 2022.07.26

프로그래밍 방식으로 마운트된 Vue 구성 요소에서 방출된 이벤트 듣기

프로그래밍 방식으로 마운트된 Vue 구성 요소에서 방출된 이벤트 듣기 맵 팝업에 HTML을 추가하기 위해 Vue 컴포넌트를 mixin에 프로그래밍 방식으로 마운트하고 있습니다.이것은 정상적으로 동작하지만, 컴포넌트에서 발생하는 이벤트를 들을 수 없습니다.또, 이 조작이 가능한지를 알 수 없습니다. 작업 코드는 다음과 같습니다. import Vue from 'vue' import myComponent from 'components/myComponent' export default { methods: { makePopup(coordinates, data) { const popup = new Vue({ ...myComponent, parent: this, propsData: data }).$mount() co..

programing 2022.07.26

왜 sun.misc는?안전하지 않은 것이 존재하며, 현실에서 어떻게 사용될 수 있을까요?

왜 sun.misc는?안전하지 않은 것이 존재하며, 현실에서 어떻게 사용될 수 있을까요? 우연히 태양과 마주쳤죠요전날 안전하지 않은 패키지로 인해 그것이 할 수 있는 일에 놀랐습니다. 물론, 그 수업은 문서화되어 있지 않지만, 나는 그것을 사용할 좋은 이유가 있는지 궁금했다.어떤 시나리오가 발생할 수 있습니까?실제 시나리오에서는 어떻게 사용할 수 있을까요? 또한, 만약 그것이 필요하다면, 당신의 디자인에 뭔가 문제가 있는 것은 아닐까요? 왜 Java는 이 클래스를 포함합니까?예 VM의 「인트라이네이션」. 즉, 록 프리 해시 테이블에서 사용되는 CAS(Compare-And-Swap)는, 실제의 JNI 콜을, CAS에 관한 특수한 순서를 포함한 네이티브 코드로 발신할 수 있습니다. CAS에 대한 자세한 내용..

programing 2022.07.26

TypeError: 정의되지 않은 속성 'getters'를 읽을 수 없습니다.

TypeError: 정의되지 않은 속성 'getters'를 읽을 수 없습니다. Vuex 스토어를 참조하는 기본적인 Vue 컴포넌트를 테스트하려고 합니다.Vue의 예(https://vue-test-utils.vuejs.org/guides/using-with-vuex.html#mocking-getters)에서 T까지)를 따라한 것 같았는데 효과가 없는 것 같습니다. 제목에 기재되어 있는 에러가 표시됩니다. const localVue = createLocalVue() localVue.use(Vuex) describe('Navbar.vue', () => { let store: any let getters: any beforeEach(() => { getters: { isLoggedIn: () => false }..

programing 2022.07.26

Vue.js에서 스크롤 다운 이벤트에서 네비게이션 페이드인 및 페이드아웃을 하는 방법YOffset = 0

Vue.js에서 스크롤 다운 이벤트에서 네비게이션 페이드인 및 페이드아웃을 하는 방법YOffset = 0 저는 Vue.js 프로젝트를 진행하고 있으며, 헤더 네비게이션 바의 작은 애니메이션에 빠져 있습니다. 사용자 스크롤 이벤트를 듣고 네비게이션 바를 페이드인/페이드아웃하고, 사용자가 아래로 스크롤하면 페이드인, 위로 스크롤하면 페이드아웃하고, 네비게이션 바 없이 전체 화면 인트로를 표시하고 싶다.내비게이션은 상단에 고정되어 있습니다. Vue.js를 사용하여 이 작업을 수행하려면 어떻게 해야 합니까? 더 나은 시각화를 위해: 이것은 내 페이지의 스크린샷입니다.이 솔루션을 귀사의 사례에 맞게 수정했습니다.showNavbar데이터 객체에 대한 속성으로 네비게이션바 상태를 변경하고transition으로 구성하..

programing 2022.07.26

vuejs의 html 태그에 dir rtl 특성 추가

vuejs의 html 태그에 dir rtl 특성 추가 다음을 사용하여 vue 프로젝트를 만들었습니다.vue create명령어. Atribute를 추가합니다.dir="rtl"html 태그로 이동합니다.에Nuxt.js델은 다음과 같이 합니다. Main View 하지만 Vuejs에서는 이 방법이 작동하지 않습니다.어떻게 하면 될까요?이 설정을 에 삽입해 보겠습니다.createdVue 인스턴스의 훅은 다음과 같습니다. new Vue({ el:"#app", ... created(){ let htmlEl=document.querySelector("html"); htmlEl.setAttribute('dir','rtl'); htmlEl.setAttribute('lang','fa'); } }) 언급URL : https:..

programing 2022.07.26

Vuex 상태를 업데이트하면 LokiJS 데이터도 변경됩니다. 이유가 무엇입니까?Vuex / LokiJs

Vuex 상태를 업데이트하면 LokiJS 데이터도 변경됩니다. 이유가 무엇입니까?Vuex / LokiJs 앱 워크플로우는 API 백엔드에서 데이터를 가져와 LokiJs의 도움을 받아 클라이언트 스토리지에 씁니다.고객 컬렉션에는 수천 개의 데이터가 있습니다.앱 상태 관리를 위해 Vuex를 사용합니다. 그리고 여기에 문제가 있다.Vuex 상태를 변경하면 LokiJS 스토리지의 데이터도 변경됩니다.어떻게 하면 피할 수 있을까요? LS(lokijs 스토리지)에서 사용자를 가져오는 Vuex 액션이 있다. getStudentByClass({ state, commit }) { const stds = students.collection.find({ class_id: state.classId }); commit('set..

programing 2022.07.26

Vue: 테이블에 중첩된 데이터 표시

Vue: 테이블에 중첩된 데이터 표시 오래된 코드를 다시 작성하고 Vue를 대체품으로 사용하는 중입니다.핸들 바를 사용하여 제작된 테이블 하나를 바꾸는 것 외에는 모든 것이 잘 진행되고 있습니다. 중첩된 핸들 바 사용{{each}}테이블 행에 관련 데이터를 표시하면서 중첩된 데이터 구조를 살펴볼 수 있습니다. 예를 들어 핸들 바를 사용하여 https://jsfiddle.net/6dsruo40/1/ Vue를 사용하여 동일한 작업을 수행하는 방법을 알 수 없습니다.v-for기타. 저만큼 만지작거려주세요.https://jsfiddle.net/cj7go6bv/ 데이터 구조를 어떻게 조작해야 할지 모르겠습니다.핸들 바의 경우와 같습니다. 사용하고 있는 데이터 구조는 다음과 같습니다. var data = [ { k..

programing 2022.07.26

vuejs2의 vnode 컨텍스트에서 감시 삭제

vuejs2의 vnode 컨텍스트에서 감시 삭제 다이렉티브바인드 방식에는vnode.context.$watch이 디렉티브가 HTML에 추가될 때마다 이전 워처와 함께 다른 워처를 추가합니다.그 때문에 같은 시청자들이 한 번 이상 전화를 걸고 있다. directive unbind 메서드가 호출되었을 때 이전 워처를 파괴할 수 있는 방법이 있습니까? Vue.directive("dynamic-lookup", { bind: function (el, binding, vnode) { let dependency = setValue("dynamic-lookup-dependency"); if (dependency) { vnode.context.$watch(dependency, function (newVal, oldVal)..

programing 2022.07.26

vee-module이 bootstrap-vue와 함께 작동하지 않음

vee-module이 bootstrap-vue와 함께 작동하지 않음 bootstrap-vue에서의 폼 검증에 vee-validate를 사용하려고 하는데 아무것도 동작하지 않습니다.기본적으로 하고 싶은 일은 다음과 같습니다. {{ errors.first('email') }} 그러나 필드에 이메일 주소가 아닌 주소를 입력해도 아무것도 표시되지 않습니다.단, 변경 시: b-form-input로.input 모든 게 잘 될 거야이 동작에 대한 회피책이 있습니까?어떤 도움이라도 주시면 감사하겠습니다.에러 메시지를 에러에 입력했습니다.내부 슬롯이 없으므로 오류 메시지가 표시되지 않습니다.입력 후로 이동하면 문제가 해결됩니다. {{ errors.first('email') }} Bootstrap-Vue를 사용할 수도 있..

programing 2022.07.26
반응형