goodsource

Vue 3 - inject()는 설정 또는 기능 컴포넌트 내에서만 사용할 수 있습니다. 왜 이런 오류가 발생하는지 이해할 수 없습니다.Vuex 스토어를 컴포지션 함수로 사용하려고 하는데 주입에 대한 오류가 계속 발생합니다(인젝트도 사용하지 않습니다).내 앱은 백엔드에 대기 API 호출을 하고 오류가 발생하면 내 구성 함수를 호출합니다. [Vue warn]: inject() can only be used inside setup() or functional components. inject @ runtime-dom.esm-bundler-9db29fbd.js:6611 useStore @ vuex.esm-bundler.js:13 useErrorHandling @ useErrorHandling.js:5 check..

Vue Single page app Router, 경로 변경 시 컴포넌트는 어떻게 됩니까? 기본 경로인 FirstPage라는 컴포넌트가 있다고 가정해 보겠습니다.FirstPage는 vuex 스토어의 액션을 사용하여 비동기 호출을 1분마다 백엔드 API로 트리거합니다(컴포넌트가 루트로 로드될 때 트리거됨). 이제 About Component is FirstPage로 이동하는 루트로 이동합니다.아직도 전화하고 있나? 편집: 저는 아직 앱 개발을 하지 않았기 때문에 예를 들어 드릴 수 없습니다. 라우터의 이러한 경우의 동작을 아는 것이 중요합니다.루트를 변경할 때마다 (필요가 없기 때문에) 상시 콜을 정지하고 싶기 때문입니다. 그 이유는 이에 따라서는 마음에 두고 있는 프로젝트의 툴링을 변경해야 하기 때문입니..

Vue에서 전자 이벤트를 사용할 때 __dirname이 정의되지 않은 수정 방법은 무엇입니까? 저는 nklayman/vue-cli-plugin-electron-builder를 사용하여 Vue/Vuex로 준비된 전자 앱을 만들었습니다.파일과 함께 배송됩니다.main.js,background.jsVue 컴포넌트 시작점을 포함합니다.하지만 행사가 제대로 진행되지 않아요.나의 시도는 수율보다 낮다.Uncaught ReferenceError: __dirname is not defined렌더링할 때(마지막으로 표시해도 됩니다. 컴포넌트: 스플래시표시하다 open background.displays(배경). import { app, protocol, BrowserWindow } from 'electron' ... a..

Vuex 스토어 데이터는 항상 메모리에 저장됩니까? 우선 저의 부족한 영어실력을 이해해주시면 감사하겠습니다.Vuex의 스토어 데이터는 항상 메모리에 저장되어 있는지 궁금합니다. 예를 들어 설명하겠습니다.A페이지에 들어갈 때 서버로부터 리스트를 받아 스토어에 저장하도록 구현했습니다.A페이지에 들어가 B페이지로 이동해도 A의 리스트는 사용되지 않아도 메모리에 남습니까? 이로 인해 매우 큰 어플리케이션에서 메모리 오버플로가 발생하지 않습니까?전체 페이지 새로고침(vue-router를 사용하는 경우)이 발생하지 않으면 전체 페이지 상태(DOM 및 Javascript/Vuex 데이터 포함)는 메모리에 남습니다.이것은 Single Page Application(SPA; 싱글 페이지응용 프로그램)이라고 불립니다. S..

Vuex에서 POST 요청을 통해 상태 데이터를 전송하는 방법 배경:'양식 구성 요소'의 양식 입력 필드를 통해 업데이트되는 '비용'이라는 Vuex 상태 개체가 있습니다.그 '비용' 오브젝트를 POST로 보내야 합니다. 문제:POST 요구를 하는 액션을 설정했습니다.그러나 상태에 저장된 '비용' 개체가 전송되지 않습니다. PS: POST 요구는 성공했지만, 응답은 데이터가 송신되지 않았음을 증명합니다. 반응 데이터: 스토어 상태 const mainURI = "/api/budget"; const expenseObj = { expensesKey: "", expensesValue: null, subExpense: null, }; export const store = new Vuex.Store({ state: ..

동적으로 생성된 형제에게 데이터 전달 저는 제가 생각하는 단순한 질문에 대한 답을 얻으려고 노력하지만 성공하지 못하고 있습니다.저는 Vue에 처음 왔어요. 설명: 웹 사이트의 "점 탐색" 사용 사례를 살펴보겠습니다.이것은 v-for loop 4 "도트" 구성요소(DotNaviElem)로 렌더링되는 구성요소(DotSideNavi)가 됩니다. 액션: 점 하나를 클릭하면 다른 모든 것을 비활성화해야 합니다(액티브클래스 삭제). 클릭 후 즉시 활성화해야 합니다. 시행 및 실패: 를 사용해 보았습니다.$emit그리고.$on둘 다 '도트' 엘에 있기 때문에 '도트' 하나를 클릭하면 이벤트가 4개의 '도트' 모두에 전달될 것으로 예상했습니다.대신 동일한 "dot" el에 대해서만 이벤트가 4번 트리거되었습니다. Vu..

로그아웃이 로컬 스토어 또는 상태에서 토큰을 지우지 않습니다. vuex를 사용하여 인증 시스템을 수행하려고 합니다.구현은 가능했지만 앱에 로그인한 후 로그아웃해도 서버에서 보호된 데이터에 액세스할 수 있으며 코드 수정에 도움이 될 수 있습니다.즉, 스토어입니다.vue 파일 코드: import Vue from 'vue'; import Vuex from 'vuex'; import { getAPI } from '@/axios'; Vue.use(Vuex); export default new Vuex.Store({ state: { accessToken: JSON.parse(localStorage.getItem('accessToken')) || null, APIData: '', }, mutations: { // e..

Vue에서 로드/오류 상태를 저장할 위치입니다.JS/Vuex? React와 함께 일한 적이 있는 Vue.js를 현재 배우고 있습니다.지금까지 모든 것이 잘 되어가고 있지만, 코드 디자인 문제에 부딪혀 구글에서 정확한 답을 찾을 수 없습니다. 학습 프로젝트로서 해커 뉴스 API의 프런트엔드를 개발하고 있습니다.상태를 관리하기 위해 Vuex를 사용하고 있습니다. 내 컴포넌트는 다음과 같습니다. // Component.vue div(v-if="item.loading") span.story-loading Loading story... div(v-else-if="item.error") span.story-error Something went wrong while fetching this story. div(v-e..

Vue 3의 Pinia와 Vuex의 이유 저는 Vue.js 개발자로 Vue 2에서 Vue 3에 추가된 새로운 기능, 즉 Composition API(Vue 3에 추가된)에 대해 자세히 알고 있습니다. 상태 관리의 경우 Vue 3의 출시와 함께 커뮤니티가 Vuex의 사용에서 Pinia로 이행하고 있는 것으로 보입니다. Pinia와 Vuex의 차이점은 무엇입니까?개념적으로 Vue 2에서 Vue 3으로 변경된 점이 Pinia를 Vue 3에 적합하게 만드는 데 있습니까? 감사합니다.즉, Pinia의 API는 훨씬 단순하고 직관적입니다.주니어 개발자에게도 가게를 쉽게 이용할 수 있습니다. Composition API의 이점을 제공하지만 Options API와 매우 유사한 구조를 가지고 있습니다. 반응성이 있다st..

클리어 방법vuejs 상태 간격 vuex에 다음 코드가 있습니다. export default new Vuex.Store({ state: { intervalVar: 0 }, mutations: { SET(state, {key, value}) { state[key] = value }, }, actions: { doSomething({commit}) { commit("SET", { key: 'intervalVar', value: setInterval( () => console.log('hi'), 30000) }) }, }, }) 보시다시피 setInterval 값을 state로 지정합니다.intervalVar인데 클리어 방법을 모르겠어요.온 상태의 인터벌intervalVar.전화하시면 됩니다.SET와의 돌연변..