Vue.js

Vue.js Vue.js
Vue.js

【Vue.js】propsは子コンポーネント内で直接変更しない(バケツリレー想定時)

以下、作業用メモです。実務のなかで、知らずにやってしまっていたことなので、メモ_φ(・_・親コンポーネントから子コンポーネントに渡されたpropは直接変更されるべきではない【理由】propsは親コンポーネントから子コンポーネントに渡されるデ...
PrimeVue

保護中: 【PrimeVue】ScrollPanelを使って利用規約(静的ファイル)を表示

このコンテンツはパスワードで保護されています。閲覧するには以下にパスワードを入力してください。 パスワード:
Vue.js

【Vue3】[vuelidate]Uncaught TypeError: Cannot read properties of undefined (reading ‘name’)のエラー対処

以下、作業用メモです。Vuelidateを使って、バリデーション機能を実装した際に、タイトルのようなエラーに遭遇しました。ブラウザ表示されず、コンソールにエラー表示されていました。具体的にエラーが出ている箇所は、以下の部分。エラーメッセージ...
Vue.js

保護中: 【Vue】[axios]フロントエンド側からバックエンド側へ値受け渡し時のデータ構造

このコンテンツはパスワードで保護されています。閲覧するには以下にパスワードを入力してください。 パスワード:
Vue.js

【Vue】i18n対応(国際化)

以下、自分用の作業メモです。Vue.js 3でi18n(国際化)を実現する方法Vue.js 3でi18n(国際化)を実現する方法はいくつかありますが、最も一般的な方法は、Vue I18n ライブラリを使用することです。以下は、Vue I18...
docker

保護中: 【Docker】Vue3の環境構築(練習用)

このコンテンツはパスワードで保護されています。閲覧するには以下にパスワードを入力してください。 パスワード:
Vue.js

保護中: 【Vue.js】CompositionAPIでaxiosを使う

このコンテンツはパスワードで保護されています。閲覧するには以下にパスワードを入力してください。 パスワード:
Vue.js

保護中: 【Vue3】CompositionAPIでPrimeVueのSteps(ステップバー)を画面に応じて切り替える実装

このコンテンツはパスワードで保護されています。閲覧するには以下にパスワードを入力してください。 パスワード:
Vue.js

保護中: 【Vue.js】$refsを使用したデータの設定

このコンテンツはパスワードで保護されています。閲覧するには以下にパスワードを入力してください。 パスワード:
Vue.js

保護中: 【Vue】[watchオプション]OptionsAPIからCompositionAPIの書き換え

このコンテンツはパスワードで保護されています。閲覧するには以下にパスワードを入力してください。 パスワード:
Vue.js

【Vue】iframeタグはそのまま埋め込む

以下、自分用の作業メモです。<iframe> タグを直接使用するVue.js では、<iframe> タグを直接使用することができます。Vue.js は HTML の一部であり、通常の HTML 要素を使うことができます。以下は、Vue.j...
Vue.js

【Vue】[Compositon API]computedとmethodsを使い分ける

以下、調べた作業用のメモです。Compositon APIでcomputedとmethodsを使い分ける際には、それぞれの特徴や用途を理解し、適切に活用することが重要です。以下は、両者の違いと使い分けに関する基本的な考え方です:comput...
Vue.js

保護中: 【Vue】[CompositionAPI]フォームの初期化

このコンテンツはパスワードで保護されています。閲覧するには以下にパスワードを入力してください。 パスワード:
Vue.js

【Vue】1つのコンポーネントに複数のtemplate

以下、調べたメモです。Vue.jsのコンポーネント内で複数の<template>ブロックを使用する理由Vue.jsのコンポーネント内で複数の<template>ブロックを使用する場合、通常は以下の理由があります。名前付きスロット(Named...
Symfony

保護中: 【Symfony,Vue】i18n対応のyamlファイルを配置

このコンテンツはパスワードで保護されています。閲覧するには以下にパスワードを入力してください。 パスワード:
Vue.js

保護中: 【Vue】[CompositionAPI]フォーム画面遷移時のバリデーション

このコンテンツはパスワードで保護されています。閲覧するには以下にパスワードを入力してください。 パスワード:
Vue.js

保護中: 【Vue】CompositionAPIでフォームを扱う

このコンテンツはパスワードで保護されています。閲覧するには以下にパスワードを入力してください。 パスワード:
Vue.js

保護中: 【Vue】CompositionAPI入門動画をみて勉強

このコンテンツはパスワードで保護されています。閲覧するには以下にパスワードを入力してください。 パスワード:
Vue.js

保護中: 【Vue】お問い合わせ送信機能のフロントエンド実装

このコンテンツはパスワードで保護されています。閲覧するには以下にパスワードを入力してください。 パスワード:
Vue.js

Vue.jsのi18nとPrimeVueのコンポーネント

以下、作業用メモです。公式Vue.jsでi18nに対応するための手順以下の手順が必要。1. i18nとは何かを理解する 2. Vue I18nプラグインをインストールする 3. プラグインをVueアプリケーションに登録する 4. ロケールフ...
Vue.js

配列やオブジェクトに値が格納されているかどうかを調べるために「.length」を用いる話

以下、作業用メモです。配列やオブジェクトに値が格納されているかどうかを調べるために.lengthを使用することは、一部の場合には適切だが、全ての場合に適用できるわけではない。例えば、配列の場合、.lengthは配列の要素数を返すため、配列が...
Vue.js

【Vue.js】v-modelには関数も指定できるらしい

以下、作業用メモです。v-modelで親から渡ってきた値の状況をみて、関数でごにょごにょして、その値を出力したい。そして子からも入力値に応じて、ごにょごにょして、親に値を渡したい。v-modelとcomputed(setterとgetter...
Vue.js

PrimeVueのDropdownコンポーネント操作②

作業用メモです。 ・Dropdownコンポーネントのplaceholder属性を使用して、選択されていない場合に表示するテキストを設定できる。また、v-modelを使用して、選択されたキャラクターのIDをバインドする。これにより、初期値が設...
Vue.js

Vue.js(単体)入門ーーせお丸さんの動画で勉強_φ(・_・

今日のアウトプットは、せお丸さんのYoutube動画です!せお丸さんは、 Symfony入門についての動画も挙げてくれていて、そこから私は認知するようになりました!ちょうどVue.js3に関した動画も挙げてくれていたので、勉強させてもらいま...
Vue.js

ChatGPTにVue.js3入門を1カ月で学習する予定表を作ってもらった

ここ最近、ChatGPTを触らない日はないほど、いろいろ試しながら使っていますが、今回はVue.jsを1か月で学習するには、どういったスケジュールで学習すると良いかどうかを聞いてみました。先日も、プログラミング学習にChatGPTを活用した...
Vue.js

【解決済み】【WP REST API とVue.js】取得と表示はできた。次は新規投稿の操作をどうやって行う?

まだ解決していない記事です。一応、載せておきます。※2023年2月19日時点で解決しました。先の記事でもWP REST APIとの連携で取得と表示はできました。それに関しては、参考にできる記事がたくさんあったのと、欲しい情報に近いものがその...
Vue.js

とりあえずデータは取得できそう。次、vueファイルにはどうやって実装する?

これは、ハマりにハマりました。。。というよりも、どんぴしゃでほしい情報がなかったので、断片的に情報を拾い上げていって実装するのが、今回は特に難しかったです。まだまだ苦手な言語化ですが、、、なんとかググることを続けて自分がえたい情報(環境とか...
Vue.js

WordPressとAPI連携

WordPressとAPI連携をするために調べたことをメモしていきます。やりたかったのは、今デモで動かしているvueファイルをデータベースと連携して、別のブラウザや他のPCからでもそのデータにアクセスできるようにさせること。。。だけど、デー...
Vue.js

【Vue.js】マスタッシュ構文で出力がうまくされない時に参考にしたサイト

単純に{{}}(マスタッシュ構文)で変数名を入れたりして出力させたい時に、なかなか表示できないという、基本的なところでつまずいていた時に参考にしていたサイトを、整理がてら載せておきます。大事なことは、単純に変数名としてだけみるんではなくて、...
Vue.js

【解決済み】【Vue.js】コンポーネント化した部品を出力するためにv-bindディレクティブが必要だった件

Vue.jsでコンポーネント化の作業を進めている時に、標題の通りの問題に当たってしまいました。v-bindディレクティブについて、参考サイトと公式サイトでは以下のようになっています。 公式サイトではぺーじ中段ほどに「v-bind」の説明が載...