Vue.jsの記事

【Vue.js3系】FormDataで画像ファイルとオブジェクトを一緒にaxiosのPUTで送ろうとするとnullになった

Nuxt.jsとLaravelで開発中のアプリの管理画面でオブジェクトのデータと画像ファイルの更新機能を作ろうとした際にdataが送れずに困ったので備忘録を残しておきます。 失敗例 最初JSON文字列に変換する方法が間違 […]

Nuxt.jsのuseContext() をVuexの中で使うと、This must be called within a setup function. のエラーになる

Nuxt.js2系のcomposition APIを使用してSPAモードの開発をしています。 .envファイルに定義した環境変数を、nuxt.config.jsのpublicRuntimeConfigに定義して以下のよう […]

Nuxt.jsのgenerateコマンドでビルドした静的ファイルをレンタルサーバーにアップしてリロードすると404エラーになる

Nuxt.jsのSPAモードで作成したアプリケーションをXserverにアップした時に上記の問題が発生しました。 開発環境ではリロードしても404エラーにはならなかったので気にもしていなかったのですが、よくよく考えればV […]

Vue.js(Nuxt.js),composition apiでpropsの値が取得できない

Nuxt.js2系のcomosition apiで親から子にpropsで値を渡して取得した値の変更を検知したい時にどうしても検知できなくて悩んだので備忘録を残しておきます。 propsの値が受け取れなかった書き方。 pr […]

【Vue.js2】日付型を文字列型(YYYY-MM-DD)の書式に変換する

日付データの変換によくmoment.jsやday.jsなどが使われていますが、今回はライブラリを使用しない方法を紹介いたします。 v-modelで入ってきた値をcomputedで変換しています。

Vue.jsで都道府県の定数を定義して、プルダウンのセレクトボックスを作る

定数ファイルを作成 定数をimportしてセレクトボックスを作る 都道府県ファイルをインポートしたらv-forを使って都道府県を表示させます。

Vue.js3系(composition API)で郵便番号から住所検索機能(yubinbango-core2)を実装する

jQueryなどで郵便番号検索機能を実装する際はyubinbango.jsなどを使うことが多いかと思いますが、Vue.jsでは「yubinbango-core2」という郵便番号のライブラリをインストールすることで実装する […]

Laravel8 Fortify Sanctum SPA認証 Vue.js3をDockerで環境構築する

概要 Laravel8.xとVue.js3を使用してSPAのサイトを作る際にログイン周りでいろいろ苦戦したので記事にしました。 今回は環境構築を行います。Laravelの環境構築、Fortify Sanctumの設定La […]