タグ付けされた質問 「vuex」

Vuexでは、「アクション」と「ミューテーション」の両方を持つロジックは何ですか？ 状態を変更できないコンポーネントのロジックを理解しています（スマートなようです）が、アクションとミューテーションの両方を持っていると、ある関数を記述して別の関数をトリガーし、次に状態を変更しているようです。 「アクション」と「ミューテーション」の違いは何ですか、それらはどのように連携しますか。さらに、なぜ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_statevuejsコンポーネントでどのように監視しますか？

168 javascript  vue.js  vuejs2  vuex 

名前空間を持つモジュール間でアクションをディスパッチすることは可能ですか？ たとえば、vuexモジュール「gameboard」と「notification」があります。それぞれに名前空間があります。ゲームボードから通知モジュールにアクションをディスパッチしたいのですが。 次のように、モジュール名をディスパッチアクション名に使用できると思いました。 // store/modules/gameboard.js const actions = { myaction ({dispatch}) { ... dispatch('notification/triggerSelfDismissingNotifcation', {...}) } } // store/modules/notification.js const actions = { triggerSelfDismissingNotification (context, payload) { ... } } しかし、これを実行しようとすると、vuexがゲームボードモジュール内でアクションをディスパッチしようとしているというエラーが発生します。 [vuex]不明なローカルアクションタイプ：notification / triggerSelfDismissingNotification、グローバルタイプ：gameboard / notification / triggerSelfDismissingNotification vuexモジュールからモジュールにディスパッチする方法はありますか、またはルートvuexインスタンスにある種のブリッジを作成する必要がありますか？

159 vue.js  vuejs2  vuex 

私の行動には次の設定があります。 get1: ({commit}) => { //things this.get2(); //this is my question! }, get2: ({commit}) => { //things }, あるアクションを別のアクションから呼び出すことができるようにしたいので、この例ではget2()、内から呼び出すことができるようにしますget1()。これは可能ですか？可能な場合、どうすればできますか？

133 vue.js  vuex 

私は最近、jQからより構造化されたフレームワークであるVueJSへの移行を開始しました。 概念的には、Vuexは私にとって少しパラダイムシフトでしたが、私は今、そのすべてが何であるかを知っており、それを完全に理解していると確信しています！しかし、ほとんどが実装の観点から、いくつかの小さな灰色の領域が存在します。 これは設計上は良いと感じますが、単方向データフローのVuex サイクルと矛盾するかどうかはわかりません。 基本的に、アクションからpromise（like）オブジェクトを返すことは良い習慣と考えられていますか？私はこれらを非同期状態のラッパーとして扱い、障害などの状態があるので、promiseを返すのに適しているようです。逆にミューテーターは物事を変えるだけで、ストア/モジュール内の純粋な構造です。

130 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) } }) -ログイン方法- login() { var …

124 vue.js  vuejs2  vuex 

私のアプリはユーザー認証にFirebaseAPIを使用しており、ログインステータスをブール値としてVuex状態で保存しています。 ユーザーがログインすると、ログインステータスを設定し、それに応じて[ログイン/ログアウト]ボタンを条件付きで表示します。 ただし、ページが更新されると、vueアプリの状態は失われ、デフォルトにリセットされます これにより、ユーザーがログインしてページが更新された場合でも、ログインステータスがfalseに戻され、ユーザーがログインしたままでもログアウトボタンの代わりにログインボタンが表示されるため、問題が発生します。 この動作を防ぐにはどうすればよいですか クッキーを使用します か、それとも他のより良い解決策が利用可能です... -

113 javascript  vue.js  vuejs2  state  vuex 

概観 Vue.js 2.xでは、model.syncされる非推奨。 では、Vue.js 2.xの兄弟コンポーネント間で通信する適切な方法は何ですか？ バックグラウンド 私がVue 2.xを理解しているように、兄弟通信の好ましい方法は、ストアまたはイベントバスを使用することです。 エヴァン（ヴューの創設者）によると： また、データフローが最終的に追跡できなくなり、デバッグが非常に困難になるため、「コンポーネント間でのデータの受け渡し」は一般に悪い考えです。 データの一部を複数のコンポーネントで共有する必要がある場合は、 グローバルストアまたはVuexを使用してください。 [ ディスカッションへのリンク ] そして： .onceおよび.sync非推奨です。小道具は常に一方通行です。親スコープで副作用を生成するには、コンポーネントはemit暗黙的なバインディングに依存するのではなく、イベントを明示的に指定する必要があります。 したがって、Evan は$emit()およびの使用を推奨してい$on()ます。 懸念 私が心配しているのは： それぞれがグローバルな可視性storeをevent持っています（私が間違っている場合は修正してください）。 マイナーなコミュニケーションごとに新しいストアを作成するのはもったいないです。 私が欲しいのは、兄弟コンポーネントのスコープ eventsまたはstores可視性です。（あるいは、おそらく私は上記の考えを理解していませんでした。） 質問 では、兄弟コンポーネント間で通信するための正しい方法は何ですか？

112 javascript  vue.js  vuejs2  vue-component  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 class="button is-medium is-primary" type="submit" …

108 vue.js  vuejs2  vue-component  vuex 

私がアクセスできるようにするstate.sessionにはinstance.jsからrecords_view.js。これはどのように達成されますか？ store / modules / instance.js const state = { // This is what I want to access in records_view.js session: {} }; const getters = { sessionGetter: state => state.session }; store / modules / records_view.js const actions = { getSettingsAction (context, props) { // This is how I'm …

106 javascript  vue.js  vuex 

シンプルVueのを考えてみましょうブログ： 私は私のデータストアとしてVuexを使用してだと私は2つの設定する必要がありゲッター：getPost取得するためのゲッターpostIDでの、だけでなく、listFeaturedPosts各機能のポストの最初の数文字を返します。注目の投稿リストのデータストアスキーマは、IDによって投稿を参照します。これらのIDは、抜粋を表示するために実際の投稿に解決する必要があります。 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 sit amet', ] } store / getters.js …

105 vuejs2  vuex 

私のVueコンポーネントは次のようなものです： <template> <div> <div class="panel-group"v-for="item in list"> <div class="col-md-8"> <small> Total: <b>{{ item.total }}</b> </small> </div> </div> </div> </template> <script> export default { ... computed: { list: function() { return this.$store.state.transaction.list }, ... } } </script> 結果{{ item.total }}は 26000000 しかし、私はそれをこのようにフォーマットしたい： 26.000.000,00 jqueryまたはjavascriptで、私はそれを行うことができます しかし、vueコンポーネントでそれを行う方法は？

85 vue.js  vuejs2  vue-component  vuex