今回もフォーム周りを修正していこうと思います。
現在の一覧・詳細表示・投稿が一つのページになっている状態から、
一覧画面 と 詳細表示/投稿/編集画面 で分けようと考えています。
この投稿ページは特に何を投稿するためのというような設定はないのですが、その形の方がコンパクトかなというのと、投稿してもリロードしないと一覧に表示されないので、いっそ別のページのほうがいいかなと考えたからです。
とりあえず今回はサーバに繋がらなかった関係で、投稿フォームを別ページにするということだけをしました。
FORMとしていた画面の名前をARTICLEに変更し、投稿フォームを削除、代わりに「新規登録」ボタンを追加しました。
「新規登録」押下で以下の画面に移動します。
こちらでデータを登録し、「一覧へ戻る」で一覧の画面に戻れます。
送信成功で強制的に一覧画面に遷移するというのも考えましたが、とりあえず今はこれで。
初めの方にも書いたように、詳細表示/投稿/編集を一つの画面で作りたいのですが、それだとv-formは使わないほうがいいのかと悩んでいます。
今のところv-formを用いてそのような画面を作っているような記事を見つけられておらず…。
いろいろ試してみようと思います。
この『VueでWEBアプリ』シリーズのコードをgithubで公開しています。参考までに。