Vue.js

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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