반응형

Vuex 119

Vue/Vuex에 mapStateToProps와 같은 리액션/리듀스가 있습니까?

Vue/Vuex에 mapStateToProps와 같은 리액션/리듀스가 있습니까? React/Redux에서 상태 및 액션을 매핑하는 일반적인 방법은 다음과 같습니다. 따라서 매핑 함수는 컴포넌트 코드와 별도로 배치됩니다. import React, { Component } from 'react'; import { bindActionCreators } from 'redux'; import { connect } from 'react-redux'; import myAction from 'actions/request'; class MyComponent extends Component { /* BODY */ } function mapStateToProps(state) { return { myComponentProp:..

programing 2022.07.31

Axios 인터셉터 내에서 Vuex 변환자를 호출하는 중

Axios 인터셉터 내에서 Vuex 변환자를 호출하는 중 요격체 내부에서 돌연변이를 일으키고 싶다.이 경우, Tahoma9}의logout변환은 Axios가 http 403을 검출할 때마다 발생합니다. 다른 곳에서와 마찬가지로 Vuex 돌연변이를 Import하고 맵을 작성했지만 Axios 인터셉터 에러 함수 내에서 액세스할 수 없었습니다.App.vue의 created() 메서드에 인터셉터 설정을 추가했습니다. 이 두 가지 질문에서 구문을 시도했지만 성공하지 못했습니다.아마도 모듈을 사용한 프로젝트와 Axios Configuration이 다음 위치에 있기 때문입니다.created()방법. https://www.reddit.com/r/vuejs/comments/eq5eej/question_how_to_acce..

programing 2022.07.31

Vue3 vuex "TypeError: vuex__"WEBPACK_IPORTED_MODULE_1_.Store.commit이 함수가 아닙니다.

Vue3 vuex "TypeError: vuex__"WEBPACK_IPORTED_MODULE_1_.Store.commit이 함수가 아닙니다. 따라서 vuex에서 정적 json 데이터를 가져와 "projects" 상태로 커밋하려고 하는데 "Store.commit is not a function" 오류가 나타납니다. 내가 뭘 빼놓았나요? Vue3의 vuex에서 이 작업을 수행한다는 것을 명심하십시오. //store.js import axios from 'axios'; import { createStore, Store } from 'vuex' export default createStore({ state: { projects:[] }, mutations: { SET_PROJECTS: (state, projec..

programing 2022.07.30

Vuex, Axios 및 여러 컴포넌트 인스턴스와의 데이터 공유 제한

Vuex, Axios 및 여러 컴포넌트 인스턴스와의 데이터 공유 제한 컴포넌트가 있습니다.QuestionContainer.vue몇 가지 질문(입력 폼)이 있습니다.모든 사용자의 답변(사용자 입력)이 실시간으로 검증됩니다(@keyup.prevent="keyUpRoutine(questionkey)")라는 이름의 메서드의 서명을 해제합니다.keyUpRoutine(questionkey)모든 답변이 유효한 경우 일관성 검사를 수행합니다. Question Container에 있습니다.vue: keyUpRoutine(questionkey) { var value = event.target.value; var question = this.questions[questionkey]; question.validated = t..

programing 2022.07.30

Vue.js에서 정적 데이터를 저장하고 소비하는 방법

Vue.js에서 정적 데이터를 저장하고 소비하는 방법 리소스 인덱스 페이지에서 사용하기 위한 매우 추상적인 테이블 구성 요소를 작성했다고 가정합니다(예:/users,/posts...). 컴포넌트에는 다음 두 가지 기본 속성만 있습니다.resourceName및 일련의resources표시할 수 있습니다.테이블을 올바르게 렌더링하기 위해 특정 리소스 유형에 연결된 일종의 구성 데이터 구조를 만들었습니다.resourceName각 리소스 유형은 테이블이 가진 다양한 열을 나타내는 객체 배열에 연결되어 있으며, 이러한 객체가 표시하는 속성 및 값을 표시하는 데 사용할 수 있는 컴포넌트 및 컴포넌트에 값을 제공하기 위해 사용할 수 있는 소품입니다. { users: [{ property: 'id', label: 'ID..

programing 2022.07.30

vuex 및 vue-resource를 사용하여 데이터 프리페치

vuex 및 vue-resource를 사용하여 데이터 프리페치 저는 http://vuex.vuejs.org/en/structure.html라는 구조 아래 앱을 만들고 있습니다. 나의components/App.vue다음과 같습니다. 데이터를 가져오려면 어떻게 해야 합니까?state.courses? 고마워요.내가 방금 알아냈어 에/components/App.vue ready기능, 전화만 하면 됩니다. ready() { this.addCourses() }, 에vuex/actions.js: import Vue from 'vue' export const addCourses = ({ dispatch }) => { Vue.http.get('/api/v1/courses') .then(response => { let c..

programing 2022.07.28

Vuex와 Redux의 불변성 접근방식의 차이점

Vuex와 Redux의 불변성 접근방식의 차이점 Vuex를 가지고 놀다가 간단한 할당으로 변환 핸들러를 통해 상태를 변환하는 것이 얼마나 쉬운지를 깨달은 저는 지금 redex와 함께 일하고 있으며 redex는 불변성을 강조하지만 코딩을 조금 더 상세하게 한다는 것을 배웠습니다.이제 의문이 생깁니다. redux는 불변성을 강조하지만 vuex는 강조하지 않는 이유는 무엇입니까? 훨씬 더 간단한 코딩으로 vuex에서도 동일한 작업을 수행할 수 있는데 왜 redux가 더 인기 있는 것처럼 보이는가? 이 두 가지 접근법의 장점과 단점은 무엇입니까? 놀랍게도 인터넷에서는 찾을 수 있는 정보가 없습니다.질문에 답하려면 둘 다 어떻게 작동하는지 알아야 합니다.Veux의 상태는 관찰 가능/반응이므로 상태를 설정합니다.어..

programing 2022.07.26

여러 vuex createNamesched에 대한 베스트 프랙티스는 무엇입니까?도우미?

여러 vuex createNamesched에 대한 베스트 프랙티스는 무엇입니까?도우미? 닫았습니다. 이 질문은의견 기반의현재 답변을 받고 있지 않습니다. 이 질문을 개선하시겠습니까?이 게시물을 편집하여 사실과 인용문으로 답변할 수 있도록 질문을 업데이트하십시오. 9개월 전에 닫았어요 이 질문을 개선하다 에 대한 좋은 관행을 찾고 있었습니다.createNamespacedHelpers찾을 수 없었습니다. 제 컴포넌트에서는 2개의 스토어 모듈에 접속하고 싶습니다.어떻게 하면 좋을까요? 다음의 3가지 가능성이 있습니다. 1: 없이 쓰기createNamespacedHelpers import { mapActions, mapGetters } from "vuex"; ... ... computed: { ...mapGet..

programing 2022.07.26

Vuex의 상태 초기화 코드를 어디에 넣어야 합니까?

Vuex의 상태 초기화 코드를 어디에 넣어야 합니까? Vuex는 상태 구조와 상태(변환, 액션)를 변경하는 방법 또는 실제 상태 초기화 및 값만 저장해야 합니까? 상태 초기화 코드가 복잡해졌을 때 Vuex 아키텍처에 이 코드를 넣을 수 있는 자연스러운 장소가 없기 때문에 고민하기 시작했습니다. 예를 들어 다음과 같은 스토어가 있다고 가정해 보겠습니다. export default { state: { list: [] }, mutations: { addItem(state, { item }) { state.list.push(item); } } } 목록이 비어 있으면 그걸로 충분합니다.그러나 목록에 대한 기본값이 있고 목록을 LocalStorage에 저장하여 페이지 로드 간 값을 유지하려면 어떻게 해야 합니까? ..

programing 2022.07.26

Vuex가 클래스 인스턴스에 간섭하지 않도록 하려면 어떻게 해야 합니까?

Vuex가 클래스 인스턴스에 간섭하지 않도록 하려면 어떻게 해야 합니까? Vuex(ProdeMirror의)에 클래스의 인스턴스를 저장하려고 합니다.이 클래스는 외부에서 거의 불변하기 때문에 변경할 때마다 클래스의 새 인스턴스를 Vuex에 넣습니다. 따라서 여기서 Vue의 변경 추적이 필요하지 않고 실제로 ProdeMirror의 내부 동작을 방해하는 것 같기 때문에 Vue에서 객체를 분리하여 원자적으로 처리할 수 있는 방법이 없을까 생각했습니다.이 질문에 대한 상위 답변의 제안을 받아들여 Vuex에게 주기 전에 클래스 인스턴스를 동결함으로써 수정했습니다. const store = new Store({ state: { editor: Object.freeze(editorState), // freeze beca..

programing 2022.07.26
반응형