반응형

vuex 285

작업 내에서 js-vue-modal을 트리거하는 방법

작업 내에서 js-vue-modal을 트리거하는 방법 vue-js-modal 라이브러리를 사용하고 있습니다.나도 vuex를 쓴다.액션 내에서 모달 열기를 트리거하려면 어떻게 해야 합니까?(과 같이)this.$modals.show('modal-name')Vue 컴포넌트 내에서만 동작)플러그인이 추가됨$modalsVue 클래스 프로토타입으로 이행하기 위해 필요한 것은 매장에서 Vue를 Import한 후 이벤트를 실행하여 모델을 표시하는 것입니다.예를 들어 다음과 같습니다. // store.js import Vue from 'vue' const vm = new Vue() ... actions: { openModal: (context, params) => { // do things vm.$modals.show(..

programing 2022.06.09

Vuex에서 액션을 사용하지 않고 돌연변이를 일으키는 것은 나쁜 것입니까?

Vuex에서 액션을 사용하지 않고 돌연변이를 일으키는 것은 나쁜 것입니까? 저는 Vuex를 사용한 지 얼마 되지 않아 항상 '컴포넌트는 동작을 사용하여 돌연변이를 커밋하여 스토어를 변환합니다'라는 패턴을 따르고 있습니다.다음 도표를 참고하여 이 방법을 사용하는 것이 적절하다고 생각했습니다. 저는 사람들이 직접 성분에 돌연변이를 일으키거나 심지어 돌연변이를 일으키는 것 외에는 아무런 목적이 없는 단순한 행동조차 하지 않는 코드를 발견했습니다.Vuex 문서에서도 몇 가지 예를 찾을 수 있었습니다. 문서에 사용되고 있기 때문에 이것은 허용 가능한 패턴이어야 한다고 생각했습니다.액션을 건너뛰고 돌연변이를 직접 트리거하는 것이 플럭스의 Redx와 같은 다른 상태 관리 라이브러리에서 승인된 패턴인지 궁금했습니다. ..

programing 2022.06.09

VueJs를 다른 컴포넌트(동일한 Axios에서 다른 컴포넌트로)

VueJs를 다른 컴포넌트(동일한 Axios에서 다른 컴포넌트로) 두 개의 다른 컴포넌트가 있으며 각각 Axios의 응답을 받습니다.단, 각 컴포넌트의 데이터를 개별적으로 취득하고 싶지 않습니다.그건 옳지 않아, 그러면 구성 요소들이 분리되고... 갱신 3 코드를 변경했는데 아직 문제가 좀 있어요.나는 Vuex와 악시오스 콜을 하고 있다.Store.js컴포넌트에 Import합니다.아래와 같습니다. 이것은 my store.js 컴포넌트입니다. import Vue from "vue"; import Vuex from "vuex"; var actions = _buildActions(); var modules = {}; var mutations = _buildMutations(); const state = { s..

programing 2022.06.09

Vuex - 첫 번째 getter 호출 시 API에서 데이터를 로드한 후 상태에서 로드합니다.

Vuex - 첫 번째 getter 호출 시 API에서 데이터를 로드한 후 상태에서 로드합니다. 나는 가지고 있다Vuex데이터를 로드하는 인스턴스API스토어에 처음 접속했을 때 API에서 데이터를 로드하고 다시 접속했을 때 로드된 데이터를 반환한다.store.empresasVuex 모듈의 외관은 다음과 같습니다. import Empresas from '@/api/empresas' import moment from 'moment' export default { state: { loaded: false, lastLoadedDate: null, empresas: [] }, getters: { empresas: state => { if (!state.loaded || moment().diff(state.lastL..

programing 2022.06.09

vuex 상태를 서버와 동기화하기 위해 권장되는 전략

vuex 상태를 서버와 동기화하기 위해 권장되는 전략 이 간단한 경우를 상상해 보세요.사용자가 작업 목록을 생성하고 정렬할 수 있는 Vue JS 애플리케이션이 있습니다.이러한 목록은 서버에 의해 데이터베이스에 저장되어야 합니다. 이렇게 '아까보다'가 .ListComponentUX의 프런트 엔드 및 백 엔드 데이터 동기화를 처리하려면 어떤 패턴을 사용해야 합니까? A) vuex로 이동: 활성 목록(표시, 편집 또는 생성된 목록)을 vuex에 저장합니다.store . 。ListComponent 바뀌게 .store그러면 목록에 대한 변경 내용이 API를 통해 백엔드로 전송됩니다. B) 서버로 직접 이동: 에서 직접 읽고 쓰기ListComponent목록을 표시, 편집 또는 작성할 때마다 서버로 전송됩니다. A를..

programing 2022.06.07

Vue.js Vuex 스토어를 올바르게 사용하는 방법watch() 메서드가 맞습니까?

Vue.js Vuex 스토어를 올바르게 사용하는 방법watch() 메서드가 맞습니까? 가게에 대해 읽었어요.watch()는 유효한 예를 찾을 수 없었습니다. Vuex 워치(fn: 함수, 콜백:기능, 옵션:오브젝트):함수 fn의 반환값을 반응적으로 감시하고 값이 변경되면 콜백을 호출합니다.fn은 스토어의 상태를 첫 번째 인수로 받고 getters는 두 번째 인수로 받습니다.Vue의 VM과 동일한 옵션을 사용하는 선택적 옵션 개체를 허용합니다.$watch 메서드시청을 중지하려면 반환된 패치 해제 함수를 호출합니다. Firebase로 로그인하기 위한 Vuex 액션이 있다. signUserIn ({commit}, payload) { commit(types.SET_LOADING, true) commit(types..

programing 2022.06.07

Vue에서 정적 구성 요소를 동적 구성 요소에 추가하는 방법

Vue에서 정적 구성 요소를 동적 구성 요소에 추가하는 방법 제가 달성하고자 하는 것은 다음과 같습니다.나는 가지고 있다사용하는 부모 컴포넌트아이들.첫 번째 자녀는 객체를 반환하는 Vuex getter를 통해 루프를 수행하고 객체의 내용에 따라 카드를 동적으로 시각화합니다.그러나 요약과 같은 다른 정적 컴포넌트가 있으며 마지막 다이내믹에 추가할 로그아웃버튼이 포함되어 있습니다.스토어에서 생성되었습니다.지금까지의 코드는 다음과 같습니다. 그걸 어떻게 달성할 수 있는지 조언해 주실 수 있나요?잘 부탁드립니다!이러한 목적을 달성하기 위한 몇 가지 방법이 있다고 생각합니다만, 현재 인덱스에 근거한 조건부 렌더링을 사용하고 싶습니다. new Vue({ el: "#app", data: { someList: [ "f..

programing 2022.06.07

Vuex Store의 Unserve 상태 변수

Vuex Store의 Unserve 상태 변수 Typescript에 Vue 및 Vuex(Store)를 설정했습니다.상태는 2개의 필드로 구성됩니다.매우 복잡한 레거시 오브젝트data그리고 간단한 ---number,예., Vue.use(Vuex); const Store = new Vuex.Store({ state: { data: new Data(...), n: 1 }, mutations: { ... } } 둘다요.data그리고.n돌연변이를 통해 업데이트될 수 있습니다.기본적으로 상태에 있는 모든 항목이 관찰 가능해지고 상태 필드의 변경 사항이 발생하면 종속 메서드, 필드 등에 대한 통지가 트리거됩니다. 나는 원하지 않는다.data관찰이 가능하려면 돌연변이를 통한 어떠한 변화도 촉발되지 않아야 합니다.어떻게..

programing 2022.06.06

Vuex 스토어에서 사용할 수 있는 값이 반응하지 않음

Vuex 스토어에서 사용할 수 있는 값이 반응하지 않음 그래서 API에서 데이터를 가져오고 있습니다.vue-resource상태가 갱신되고 콘솔에서 원하는 값을 확인할 수 있습니다.문제는 저장소에서 데이터를 로드할 때 응용 프로그램이 로드 중인 응용 프로그램에 영향을 주지 않는 것처럼 보이지만, 예를 들어 페이지 간에 바꾸면 정보가 올바르게 표시되는 것입니다.이로 인해 라이프 사이클 훅이 잘못되었거나 vuex 내에서 상태를 잘못 처리했다고 믿게 되었습니다. Vuex 스토어 import Vue from 'vue' import Vuex from 'vuex' import VueResource from 'vue-resource' Vue.use(VueResource) Vue.use(Vuex) const state ..

programing 2022.06.06

비동기 API 호출 후 vuex getter를 사용하는 방법

비동기 API 호출 후 vuex getter를 사용하는 방법 상태를 변환한 비동기 작업을 디스패치한 후 vuex에서 getter를 호출하는 적절한 방법은 무엇입니까? 나는 내가 의미하는 바를 설명하기 위해 예시 스니펫을 만들었다.당신이 볼 수 있듯이.getLastNameByName()에러가 발생하다state.persons비어 있습니다.이상한 건, 제가 인쇄를 하면state.persons이 getter에서는 api 호출 후에 어레이가 출력합니다. 예상되는 동작은 다음과 같습니다.getLastNameByName('John')돌아온다{name: 'John', lastname: 'Smith'} const store = new Vuex.Store({ state: { persons: [] }, getters: { ..

programing 2022.06.06
반응형