- 2020年4月4日
- 2021年7月5日
vue-cliをインストールしようとしたら「gyp: No Xcode or CLT version detected!」というエラーが出て困った件
要約 ・vue-cliでローカルにvue環境を作ろうとした・npm install -g @vue/cliで「gyp: No Xcode or CLT version detected!」というエラーが出た・xcodeの再インストールで解決した Vu […]
TAG
Vue.js
- 2020年3月29日
- 2021年10月27日
Vue.jsのフィルターでデータを加工する
はじめに こんにちは、てりー(@teriteriteriri) Vue .jsでプログラムを書いていくと、「小文字は全て大文字に変換したい！！」や「金額を税込み表示にしたい！」などの様にテキスト系の変換処理を一律で行いたい場面に遭遇すると思います。 […]
- 2020年3月9日
- 2021年10月27日
v-modelで様々な入力フォームを作る
はじめに 前回はv-modelの修飾子を見ていきました。今回は複数行やチェックボックス、ラジオボタンなどのパターンを見ていきます。 複数行の入力フォーム inputでは実現できなかった複数行のフォームはtextareaを使う事で実現可能です。 また、 […]
- 2020年3月8日
- 2021年7月5日
v-modelの修飾子を使って実践的なフォームを作る
はじめに 以前の記事でv-modelの基本的な使い方を解説していきました。 v-modelは双方向のデータバインディングであり、前回の記事内でinputタグでよく使われると話しましたが、そのほかにも様々なパターンが用意されています。 今回は入力フォー […]
- 2020年3月8日
- 2020年3月8日
動的コンポーネントを使い表示内容を切り替える
こんにちは！てりーです(@teriteriteriri)。今回はVue.jsで動的にコンポーネントを切り替える方法を見ていきます。 動的コンポーネントの使い方 :is=”変数”で切り替える 分かりやすい例です。コンポーネントを […]
- 2020年2月22日
- 2020年3月5日
v-slotで親子間で様々なやりとりを行う
v-slot propsはあくまでStringやNumberなどのデータしか送れません。htmlタグを送る時は別のやり方があります。 子コンポーネントに受け皿としてslotを使う 以下の様に、子コンポーネントでは受け皿として<slot>を […]
- 2020年2月22日
- 2020年3月5日
Vue-cliについて学ぶ
プロジェクトとは プロジェクトとは、プログラムの作成に必要な色々なファイル(スクリプトファイル、イメージファイルなど)をまとめて管理するものです。 今までやってきた様な自分で1からファイルを全て作成する様なやり方はフルスクラッチと呼び、区分されていま […]
- 2020年2月17日
- 2020年3月5日
親コンポーネントから子コンポーネントへのデータの受け渡し
コンポーネント間でdataの受け渡しで出来ること 親コンポーネントの内容に合わせて子コンポーネントの内容も変える事が可能です。 例えばブログサービスをやってる時、親コンポーネントに書いた内容によって、子コンポーネントのタイトルやフォント、文字色なんか […]
- 2020年2月16日
- 2021年10月27日
methodsとcomputedを使ってイベント処理を行う
はじめに 「v-on」の記事にてイベントの作り方は説明しました。 その時の様に、処理が短い場合はそのままダブルクウォークテーションの中に書く事が多いです。しかし、長い処理をした場合にはそのまま書くのは煩雑で見にくくなってしまいます。 そのような場合に […]
- 2020年2月15日
- 2020年3月5日
v-model ・v-onを理解する
今回はVueのテンプレート構文であるv-modelとv-onの使い方や実用例をみていきます。これまでにVueのテンプレート構文ではv-ifでの条件分岐、v-forでのループ処理、v-bindでの属性のバインドを見てきました。詳しくは以下の記事をご覧く […]