반응형

vuex 217

Nuxt 저장소에서 오류 페이지로 이동하는 방법

Nuxt 저장소에서 오류 페이지로 이동하는 방법 export const state = () => ({ data: {} }) export const getters = { data: state => state.data } export const actions = { getData ({ commit }) { this.$axios('https://jsonplaceholder.typicode.com/todosx/1') .then((response) => { commit('SET_DATA', response.data) }) .catch((err) => { // Navigate to error page }) } } export const mutations = { SET_DATA (state, data) { state..

IT이야기 2022.05.14

2단계 하위 개체에 대해 Vue.set 반응성이 작동하지 않음

2단계 하위 개체에 대해 Vue.set 반응성이 작동하지 않음 나는 답을 가지고 있고 각각의 답변은 여러 개의 코멘트를 가지고 있고 각각의 코멘트는 또한 여러 개의 어린이 코멘트를 가지고 있다. ...mapState({ comments: function (state) { if (this.answer_id) { let indexIs = state.mainAnswer.answers.findIndex(answer => { return answer.answer_id === this.answer_id }) return state.mainAnswer.answers[indexIs].comments } } }) 나는 매장에서 데이터를 검색하기 위해 mapState를 사용하고 있다. 여기 그것이 어떻게 보이는지 스크린샷..

IT이야기 2022.05.14

Composition API를 사용하여 Vuex 지도 도움말에 액세스하는 방법

Composition API를 사용하여 Vuex 지도 도움말에 액세스하는 방법 나는 Vue2에서 컴포지션 API를 사용하고 있다.접근 방법을 알려주시겠습니까?mapState컴포지션 API로?국가 변화도 지켜보고 싶다.따라서 나는 설정 기능 내에서 그것을 사용해야 할 것이다.고마워요.Vue 2 또는 Vue 3 구성 API에서는 Vuex 지도 도우미가 지원되지 않으며(Yet?) 그들을 위한 이 제안은 한동안 보류되었다. 문서와 같은 계산을 수동으로 생성해야 할 경우: const item = computed(() => store.state.item); 보다 완벽한 예: import { computed } from 'vue'; import { useStore } from 'vuex'; export default..

IT이야기 2022.05.13

Vuex 모듈의 형식 오류 "표현으로 호출될 때 클래스 장식가의 서명을 확인할 수 없음"

Vuex 모듈의 형식 오류 "표현으로 호출될 때 클래스 장식가의 서명을 확인할 수 없음" 라이브러리에서 내보내는 Typecript를 사용하는 다음 Vuex 모듈이 있음: import * as types from '@/store/types'; import {Formio} from 'formiojs'; import { VuexModule, Module, Mutation, Action } from 'vuex-module-decorators' interface RoleItem { _id: string; title: String; admin: Boolean; default: Boolean; } interface RoleList { [key: string]: RoleItem; } export class Auth e..

IT이야기 2022.05.12

Vuex 작업 vs 돌연변이

Vuex 작업 vs 돌연변이 Vuex에서 "동작"과 "교화"를 모두 갖는 논리는 무엇인가? 구성 요소들이 상태를 수정할 수 없다는 논리(똑똑해 보이는 것)는 이해하지만, 작용과 돌연변이를 모두 갖는 것은 다른 기능을 촉발시키고, 그 다음 상태를 변화시키기 위해 하나의 함수를 쓰는 것처럼 보인다. '행동'과 '교화'의 차이점은 무엇이며, 어떻게 함께 작동하는지, 게다가 Vuex 개발자들이 왜 이렇게 하기로 했는지 궁금하다.질문 1: Vuejs 개발자들이 왜 이런 식으로 하기로 결정했는가? 답변: 당신의 어플리케이션이 커지면, 그리고 이 프로젝트를 위해 여러 개발자들이 일하고 있을 때, 당신은 "국가 관리" (특히 "글로벌 상태")가 점점 더 복잡해 질 것이라는 것을 알게 될 것이다. vuex 방식(Rede..

IT이야기 2022.05.12

Global Guard 내부 모의 상점 게이터가 작동하지 않음

Global Guard 내부 모의 상점 게이터가 작동하지 않음 나는 가게에서 게이터를 사용하는 글로벌 가드를 만들었다. 나는 시험 삼아 가게에서 물건을 사는 사람들을 놀리려고 한다.문제는 조롱하는 것이다. 효과가 없다. // router/index.ts export function beforeEach(to: any, from: any, next: any) { const isLoggedIn = store.getters.isLoggedIn(); const isGuest = to.matched.some((record: any) => (record.meta.guest)); if (isLoggedIn) { // isLoggedIn is always false if (isGuest) { next('/'); } } ..

IT이야기 2022.05.12

vuex와 vue-router를 사용하여 백엔드와 프런트엔드 사이의 상태를 동기화하는 방법

vuex와 vue-router를 사용하여 백엔드와 프런트엔드 사이의 상태를 동기화하는 방법 나는 vue-cli3와 npm을 이용한 한 페이지 어플리케이션을 개발하고 있다. 문제:새 값을 표시하는 프런트엔드의 백엔드에서 증가/감소된 기본 정수 값(vuex 상태로 저장됨)을 채우는 중. 증분/감소 변이는 두 구성 요소(프론트 엔드/백엔드)에서 모두 정상 작동하지만, 동일한 경로 인스턴스(instance)에서는 작동하지 않는 것 같다.백엔드에서 카운터를 증가/감소할 때, 값은 프런트엔드에서 업데이트되지 않는다. store.js: 백엔드/프론드 간에 동기화해야 하는 상태를 포함한다. import Vue from 'vue' import Vuex from 'vuex' Vue.use(Vuex) export defau..

IT이야기 2022.05.11

인덱스에서 스플라이싱되지 않은 스플라이스는?

인덱스에서 스플라이싱되지 않은 스플라이스는? 여기 바닐라 js 문제일 수도 있지만 특히 vuex에서 일하고 있다.상품 리스트에서 쇼핑카트로 버튼을 누르는 카트 설정이 있는데, 카트에서 삭제는 안 되네.여기 내 접근법이 있다. 버튼에서 동작을 호출하는 아이; Remove from Cart data() { return { singleCart: this.items, }; }, methods: { removeItem() { this.$store.dispatch("DELETE_CART_ITEM", this.singleCart.item_id); }, }, 그리고 내 vuex 상점에 있는 논리. const actions = { ADD_TO_CART: (context, payload) => { context.commi..

IT이야기 2022.05.11

구성 요소의 Vuex

구성 요소의 Vuex 인터넷에서 이용할 수 있는 공식 Vuex 문서와 가이드에서, 당신의 상점 상태나 Getter에 접근하기 위해서는, 당신이 필요로 하는 데이터를 반환하는 계산된 속성을 생성해야 한다고 언급되어 있다(예: 이것).$store.state.info) 또는 MapState 도우미를 사용할 수 있다. 다음과 같은 템플릿에서 직접 참조하는 템플릿의 Vuex 데이터에 액세스한다. {{ $store.state.info }} 게이터도 마찬가지다.잘 되긴 하는데, 내가 Vuex에 대해 읽은 기사들은 다 이렇게 안 되던데 내가 실수하는 건 아닌지 모르겠어.가이드는 항상 MapState 또는 MapGetter를 사용하여 직접 계산된 속성을 생성한다. 너는 내가 하고 있는 방식이 괜찮다고 생각하니, 아니면 ..

IT이야기 2022.05.10

Vue.js: 사용자가 로그인하거나 로그인하지 않을 때 Vuex Store 상태를 기준으로 탐색 모음의 버튼 표시/숨기기

Vue.js: 사용자가 로그인하거나 로그인하지 않을 때 Vuex Store 상태를 기준으로 탐색 모음의 버튼 표시/숨기기 사용자가 로그인했는지 여부에 따라 단추를 표시하거나 숨기는 네비바를 만들고 있다.이를 위해 Vuex와 localStorage에 상태를 저장한다. 객체 목록(즉, 객체 목록)을 사용하여 동적 메뉴를 구축하려고 한다.rightMenu버튼의 정보(즉, 사용자가 로그인한 경우 버튼의 표시 여부를 나타내는 경로, 제목 및 플래그)가 포함되어 있다. 사용자가 시스템에 항상 로그인하는 경우this.$store.state.auth.isUserLoggedIn로 바뀌다.true그러나 템플릿은 변경되지 않고 사용자가 로그인하지 않았을 때 버튼은 동일한 초기 상태로 유지된다.예:sign out버튼이 표시되..

IT이야기 2022.05.10
반응형