คำถามติดแท็ก vuex

ใน Vuex ตรรกะของการมีทั้ง "การกระทำ" และ "การกลายพันธุ์คืออะไร" ฉันเข้าใจตรรกะของส่วนประกอบที่ไม่สามารถแก้ไขสถานะ (ซึ่งดูเหมือนว่าฉลาด) แต่การมีทั้งการกระทำและการกลายพันธุ์ดูเหมือนว่าคุณกำลังเขียนฟังก์ชันหนึ่งเพื่อเรียกใช้ฟังก์ชันอื่นเพื่อเปลี่ยนสถานะ อะไรคือความแตกต่างระหว่าง "การกระทำ" และ "การกลายพันธุ์" พวกเขาทำงานร่วมกันอย่างไรและ moreso ฉันสงสัยว่าทำไมนักพัฒนา Vuex จึงตัดสินใจทำเช่นนี้

173 vue.js  vuex 

ฉันใช้vuexและvuejs 2ร่วมกัน ฉันยังใหม่กับvuexฉันต้องการดูการstoreเปลี่ยนแปลงตัวแปร ฉันต้องการเพิ่มwatchฟังก์ชั่นในของฉันvue component นี่คือสิ่งที่ฉันมี: import Vue from 'vue'; import { MY_STATE, } from './../../mutation-types'; export default { [MY_STATE](state, token) { state.my_state = token; }, }; ฉันต้องการทราบว่ามีการเปลี่ยนแปลงใด ๆ ในหรือไม่ my_state ฉันจะดูstore.my_stateในองค์ประกอบ vuejs ของฉันได้อย่างไร

169 javascript  vue.js  vuejs2  vuex 

เป็นไปได้หรือไม่ที่จะส่งการกระทำระหว่างโมดูลเนมสเปซ เช่นฉันมีโมดูล "gameboard" และ "การแจ้งเตือน" ของโมดูล vuex แต่ละคนมีเนมสเปซ ฉันต้องการส่งการกระทำจาก gameboard ไปยังโมดูลการแจ้งเตือน ฉันคิดว่าฉันสามารถใช้ชื่อโมดูลในชื่อการกระทำการจัดส่งเช่นนี้: // store/modules/gameboard.js const actions = { myaction ({dispatch}) { ... dispatch('notification/triggerSelfDismissingNotifcation', {...}) } } // store/modules/notification.js const actions = { triggerSelfDismissingNotification (context, payload) { ... } } แต่เมื่อฉันพยายามทำสิ่งนี้ฉันได้รับข้อผิดพลาดที่ทำให้ฉันสิ่ง vuex พยายามส่งการกระทำภายในโมดูล gameboard ของฉัน: [vuex] ประเภทการกระทำในท้องถิ่นที่ไม่รู้จัก: การแจ้งเตือน / ทริกเกอร์ SelfDismissing …

159 vue.js  vuejs2  vuex 

ฉันมีการตั้งค่าต่อไปนี้สำหรับการกระทำของฉัน: get1: ({commit}) => { //things this.get2(); //this is my question! }, get2: ({commit}) => { //things }, ฉันต้องการเรียกการกระทำหนึ่งจากภายในอีกรายการหนึ่งดังนั้นในตัวอย่างนี้ฉันต้องการสามารถเรียกget2()จากภายในget1()ได้ เป็นไปได้หรือไม่และถ้าเป็นเช่นนั้นฉันจะทำได้อย่างไร

136 vue.js  vuex 

ฉันเพิ่งเริ่มโยกย้ายสิ่งต่างๆจาก jQ ไปยังเฟรมเวิร์กที่มีโครงสร้างมากกว่าคือ VueJS และฉันก็ชอบมัน! ตามแนวคิดแล้ว Vuex เป็นการปรับเปลี่ยนกระบวนทัศน์เล็กน้อยสำหรับฉัน แต่ฉันมั่นใจว่าฉันรู้ว่าตอนนี้มันเป็นอย่างไรและเข้าใจทั้งหมด! แต่มีพื้นที่สีเทาเล็กน้อยส่วนใหญ่มาจากมุมมองของการนำไปใช้งาน อันนี้ฉันรู้สึกว่าดีจากการออกแบบ แต่ไม่รู้ว่ามันขัดแย้งกับวัฏจักร Vuex ของการไหลของข้อมูลแบบทิศทางเดียวหรือไม่ โดยพื้นฐานแล้วถือเป็นแนวทางปฏิบัติที่ดีในการคืนสัญญา (- เหมือน) วัตถุจากการกระทำหรือไม่? ฉันถือว่าสิ่งเหล่านี้เป็นเหมือน async wrappers ด้วยสถานะของความล้มเหลวและสิ่งที่คล้ายกันดังนั้นดูเหมือนว่าจะเหมาะสมที่จะคืนสัญญา ผู้กลายพันธุ์ในทางตรงกันข้ามจะเปลี่ยนสิ่งต่าง ๆ และเป็นโครงสร้างที่บริสุทธิ์ภายในร้านค้า / โมดูล

131 promise  vue.js  es6-promise  state-management  vuex 

ฉันพยายามตรวจสอบสิทธิ์ผู้ใช้โดยใช้หนังสือเดินทางของ vuejs และ laravel ฉันไม่สามารถหาวิธีส่งพารามิเตอร์หลายตัวไปยังการกลายพันธุ์ของ vuex ผ่านการกระทำได้ - ร้านค้า - export default new Vuex.Store({ state: { isAuth: !!localStorage.getItem('token') }, getters: { isLoggedIn(state) { return state.isAuth } }, mutations: { authenticate(token, expiration) { localStorage.setItem('token', token) localStorage.setItem('expiration', expiration) } }, actions: { authenticate: ({ commit }, token, expiration) => commit('authenticate', token, expiration) …

126 vue.js  vuejs2  vuex 

ฉันมีส่วนประกอบที่มีการตรวจสอบความถูกต้องของรูปแบบบางอย่าง เป็นแบบฟอร์มการชำระเงินหลายขั้นตอน โค้ดด้านล่างนี้ใช้สำหรับขั้นตอนแรก ฉันต้องการตรวจสอบว่าผู้ใช้ป้อนข้อความบางส่วนเก็บชื่อไว้ในสถานะส่วนกลางแล้วส่งไปยังขั้นตอนถัดไป ฉันใช้vee-validateและ vuex <template> <div> <div class='field'> <label class='label' for='name'>Name</label> <div class="control has-icons-right"> <input name="name" v-model="name" v-validate="'required|alpha'" :class="{'input': true, 'is-danger': errors.has('name') }" type="text" placeholder="First and Last"> <span class="icon is-small is-right" v-if="errors.has('name')"> <i class="fa fa-warning"></i> </span> </div> <p class="help is-danger" v-show="errors.has('name')">{{ errors.first('name') }}</p> </div> <div class="field pull-right"> <button …

118 vue.js  vuejs2  vue-component  vuex 

ภาพรวม ใน Vue.js 2.x, model.syncจะเลิก ดังนั้นวิธีที่เหมาะสมในการสื่อสารระหว่างส่วนประกอบพี่น้องในVue.js 2.xคืออะไร? พื้นหลัง ตามที่ผมเข้าใจ Vue 2.x วิธีที่แนะนำสำหรับพี่น้องสื่อสารคือการใช้ร้านค้าหรือรถบัสเหตุการณ์ ตามที่Evan (ผู้สร้าง Vue): นอกจากนี้ยังควรค่าแก่การกล่าวถึง "การส่งผ่านข้อมูลระหว่างส่วนประกอบ" โดยทั่วไปเป็นความคิดที่ไม่ดีเพราะในที่สุดโฟลว์ข้อมูลจะไม่สามารถติดตามได้และแก้ไขข้อบกพร่องได้ยากมาก หากชิ้นส่วนของข้อมูลความต้องการที่จะใช้ร่วมกันโดยองค์ประกอบหลายชอบ ร้านค้าทั่วโลกหรือVuex [ ลิงก์ไปยังการสนทนา ] และ: .onceและ.syncเลิกใช้แล้ว ตอนนี้อุปกรณ์ประกอบฉากจะลงทางเดียวเสมอ ในการสร้างผลข้างเคียงในขอบเขตหลักส่วนประกอบจำเป็นต้องemitสร้างเหตุการณ์อย่างชัดเจนแทนที่จะอาศัยการผูกโดยนัย ดังนั้นอีวานแสดงให้เห็นการใช้และ$emit()$on() ความกังวล สิ่งที่ฉันกังวลคือ: แต่ละคนstoreและeventมีการมองเห็นทั่วโลก (ถูกต้องฉันหากฉันผิด); เป็นการสิ้นเปลืองเกินไปที่จะสร้างร้านค้าใหม่สำหรับการสื่อสารเล็กน้อย สิ่งที่ฉันต้องการคือขอบเขต eventsหรือstoresการมองเห็นสำหรับส่วนประกอบพี่น้อง (หรือบางทีฉันอาจไม่เข้าใจแนวคิดข้างต้น) คำถาม ดังนั้นวิธีที่ถูกต้องในการสื่อสารระหว่างส่วนประกอบพี่น้องคืออะไร?

114 javascript  vue.js  vuejs2  vue-component  vuex 

พิจารณาง่าย Vue บล็อก: ฉันใช้ Vuex เป็นเก็บข้อมูลของฉันและฉันต้องตั้งค่าสองgettersกgetPostทะเยอทะยานสำหรับการเรียกpostตามรหัส, เช่นเดียวกับlistFeaturedPostsที่ผลตอบแทนไม่กี่ตัวอักษรแรกของแต่ละโพสต์ที่โดดเด่น สคีมาพื้นที่เก็บข้อมูลสำหรับรายการโพสต์ที่แนะนำอ้างอิงโพสต์ตามรหัสของพวกเขา รหัสเหล่านี้ต้องได้รับการแก้ไขเป็นโพสต์จริงเพื่อจุดประสงค์ในการแสดงข้อความที่ตัดตอนมา store / state.js export const state = { featuredPosts: [2, 0], posts: [ 'Lorem et ipsum dolor sit amet', 'Lorem et ipsum dolor sit amet', 'Lorem et ipsum dolor sit amet', 'Lorem et ipsum dolor sit amet', 'Lorem et ipsum dolor …

113 vuejs2  vuex 

แอปของฉันใช้ Firebase API สำหรับการตรวจสอบผู้ใช้โดยบันทึกสถานะการเข้าสู่ระบบเป็นค่าบูลีนในสถานะ Vuex เมื่อผู้ใช้เข้าสู่ระบบฉันตั้งค่าสถานะการเข้าสู่ระบบและแสดงปุ่มเข้าสู่ระบบ / ออกจากระบบตามเงื่อนไข แต่เมื่อรีเฟรชหน้าแล้วสถานะของแอป vue จะหายไปและรีเซ็ตเป็นค่าเริ่มต้น สิ่งนี้ทำให้เกิดปัญหาแม้ว่าผู้ใช้จะเข้าสู่ระบบและเพจได้รับการรีเฟรชสถานะการเข้าสู่ระบบจะถูกตั้งค่ากลับเป็นเท็จและปุ่มล็อกอินจะแสดงแทนปุ่มล็อกเอาต์แม้ว่าผู้ใช้จะยังคงล็อกอินอยู่ก็ตาม .... ฉันจะทำอย่างไรเพื่อป้องกันพฤติกรรมนี้ ฉันจะใช้คุกกี้ได้ หรือไม่หรือวิธีการอื่นที่ดีกว่านี้ ... -

113 javascript  vue.js  vuejs2  state  vuex 

ฉันต้องการที่จะเข้าถึงstate.sessionในจากinstance.js records_view.jsสิ่งนี้สำเร็จได้อย่างไร? store / module / instance.js const state = { // This is what I want to access in records_view.js session: {} }; const getters = { sessionGetter: state => state.session }; store / module / records_view.js const actions = { getSettingsAction (context, props) { // This is how …

100 javascript  vue.js  vuex