Vue.js/Nuxt.js

[Nuxt.js]Pay.jpの「既にインスタンス化されています」というエラーを解決する

Nuxt.jsで作っているサイトに決済サービスのPay.jpを導入しようとした際に「既にインスタンス化されています」というエラーが発生したので対処法をまとめます。 エラーの発生条件 次のような流れで決済画面にアクセスするとエラーが発生します...
Vue.js/Nuxt.js

Vue.js(Nuxt.js)でBulmaのModalを使う方法

今回はVue.js・Nuxt.jsでBulmaのModalを使う方法を書きます。 導入方法 BulmaをNuxt.jsに導入する方法は下の記事に載せてあります。 Modalを実装 ModalのHTML <button @click=...
Vue.js/Nuxt.js

Nuxt.jsにBulmaを導入する方法

Nuxt.jsで作っているプロジェクトにフレームワークのBulmaを導入することがあったのでメモ 今回はCDNではなくnpmでインストールして導入します。 パッケージをインストール Bulmaのインストール npm install bul...
Vue.js/Nuxt.js

Nuxt.jsでAxiosを使ってみる

Nuxt.jsでAxiosを使う方法をメモ インストール npm install @nuxtjs/axios --save nuxt.config.js modules: [ "@nuxtjs/axios", ], nuxt.con...
Vue.js/Nuxt.js

Nuxt.jsでページタイトルを変更する方法

Nuxt.jsでページタイトルを変更する方法をメモ 次のように書くことでタイトルを変更できます。 document.title = "タイトル" タイトルを設定したい場合はmountedに上のように書けばタイトルを設定できます。
Vue.js/Nuxt.js

Nuxt.jsにreCaptcha v3を導入してみる

Nuxt.jsにreCaptchaのv3を導入したのでメモ nuxt.config.js(色々省略しています) head:{ {src:"サイトキー"} } index.vue export default{ data...
Vue.js/Nuxt.js

Nuxt.jsのmethodsでページ遷移

Nuxt.jsのmethodsでページ遷移をする方法を備忘録として書いておきます。 (多分素のVue.js + Vue-routerでも使えます) export default { methods:{ redirec...
Web

CloudFlare経由でのアクセスでNginxが受け取るIPアドレスを正しくする方法

CloudFlare経由でNginxへのアクセスがあった際に本物のIPアドレスを取得する方法を紹介します。 Nginxの設定ファイルに下のように追加することでヘッダーのX-Forwarded-Forに正しいIPアドレスが入ります。 No...
Vue.js/Nuxt.js

Vue-routerで動的リンクを生成してみる

Vue-routerで動的なリンクを生成する方法をメモ ルーティング { path:"/test/:id" name:"test", component:test } パラメーターの取得 test.vue met...
Vue.js/Nuxt.js

Vue.jsで外部のスクリプトを読み込む方法

Vue-cliで開発していてCDN経由で外部のスクリプト(recaptcha)を読み込もうとした際にハマったのでメモ main.js mounted(){ let recaptchaScript = document.create...
タイトルとURLをコピーしました