はじめに namespacedを使ってvuexをモジュール化する方法について 前提 現在、vuexストアの構成はapp/javascript/store/index.jsファイルがあるだけで、そこにタスク関連の状態管理を記述しています。 今後ユーザーなどの状態管理もするために、設定ファイル…

はじめに vuexを使ってタスクの更新と削除機能を実装します。 親コンポーネントから詳細ページモーダルを呼び出して、 その詳細ページに編集ボタンと削除ボタンがあり、 編集ボタンを押すと、編集ページのモーダルが表示される。 タスク編集ページを作成 <template> <div :id="'task-edit-modal-' + task.id"> <div class="modal" @click.self="handleCloseModal"> <div class="modal-dialog"> <div class="modal-content"></div></div></div></div></template>…

はじめに 状態管理ライブラリのvuexを使ってデータを管理します。 vuexの設定 まずはvuexをインストールします。 $ yarn add vuex vuexの設定ファイルを作成します。 $ touch app/javascript/store/index.js import Vue from 'vue' import Vuex from 'vuex' …