-
Laravel+Vue/Vuetify Paginationを使ってみる
簡単にページネーションを作れるVue/VuetifyのPaginationを使ってみます。Laravel側からAxiosを使ってAPIでデータを取得し、Vuet…
-
Vuetify Vue Router まとめ
Vue RouterはLaravelの管理画面をvue-routerを使ってSPA化で使用し簡単に説明しましたがインストールや設定、リンク方法の復習からパラメー…
-
Vue/Vuetify Vuexを使ってみる
Vue.jsで親子関係でない独立したコンポーネント間でもデータ共有したい場合は状態管理ライブラリVuexが便利です。Vuexの基本的な設置方法や注意点、別コンポ…
-
Vue/Vuetify ダイアログの設置と親子コンポーネント間のデータ送受信
Vue.jsにおける子コンポーネントの設置方法とpropsと使った親コンポーネントから子コンポーネントへのデータ送受信、および$emitを使った子コンポーネント…
-
Laravel+Vue LaravelMixでフロントと管理画面を別のSPAとして扱う
LaravelをAuthをインストールした時点でVue.jsを利用でき、resources/js/app.jsでVueインスタンスを生成していますが、このままで…
-
Laravel+Vue/Vuetify 編集機能を追加
前回までで登録・一覧・削除ができたので今回は編集機能を作ります。Actionsのペンアイコンをクリックしたときに該当データの編集画面を表示しデータの変更ができる…
-
Laravel+Vue/Vuetify 削除確認ダイアログを表示してデータ削除
前回はLaravel+Vue/Vuetify Data tableを利用してデータ一覧を作成しました。 Actionsのゴミ箱アイコンをクリックしたときに削除確…
-
Laravel+Vue/Vuetify Data tablesで一覧作成
前回は非同期バリデーションとともに登録を行いました。今回はLaravelのSeederでテストデータを生成して、Vue/VuetifyのData tablesを…
-
Laravel+Vue/Vuetifyで非同期バリデーション
前回作成したVue/Vuetifyのフォームにおける登録処理時のLaravel側での非同期バリデーションの実装です。具体的にはAxiosで非同期でフォーム値を送…
-
LaravelでVue/Vuetifyを使ってFormを作成
前回作成した管理画面で、Vue/Vuetifyを使用してテキストボックス、テキストエリア、ラジオボタン、チェックボックス、セレクトボックスの送信フォームを作成し…
-
Laravelの管理画面をvue-routerを使ってSPA化
前回はVuetify/DrawerメニューでLaravelの管理画面を作成しました。今回はvue-routerをインストールして管理画面をSPA（Single-…
-
LaravelでVuetifyのDrawerメニューで管理画面作成
LaravelでVue.js用のUIコンポーネントライブラリを利用できるUIフレームワークVuetifyをインストールし、VuetifyのDrawerメニューを…