Vue.jsでイベント処理をしてみます。今回は、簡単にクリックしたときの処理を書きます。クリック以外のイベントも試してみると良いです。 v-on 参考サイト v-on HTML側は、v-on:イベント名="メソッド名"で指定します。JavaScript側は、Vueインスタンスのオプ…

v-bindを使ってHTMLの属性を書き換えます。ここでは、href属性とclass属性を書き換えてみます。 v-bindでhref属性を書き換える v-bindの間違った書き方 v-bindでclass属性を書き換える v-bindでhref属性を書き換える <div id="app"> <p><a v-bind:href="url">{{title}}</a></p> </div> var app = new Vue({ el: '#…

v-forを使って、繰り返し処理をします。配列の場合とオブジェクトの場合を見ていきます。若干、書き方が異なるので注意してください。 v-for:配列 v-for:オブジェクト 参考サイト v-for:配列 配列をv-forで処理する書き方です。 <div id="app"> <ul> <li v-for="color in colors">{{color.name}}</li> </ul> </div> var app …

v-ifとv-showを使って表示を制御します。trueの時に表示して、falseの時に非表示にします。HTMLのコードがどのようになるのか確認します。v-ifとv-showの違いについても書きます。 v-ifで表示の制御 複数の要素を出し分ける v-showで表示の制御 ディレクティ…

去年、Vue.jsの勉強を始めようとしましたが、他の勉強を優先したので、後回しになってしまいました。そちらの勉強が一通り済んだので、今年に入ってからVue.jを勉強しました。まずは、Vue.jsの導入と基本の表示について書きます。 Vue.jsとは CDN版とVue CLI…

Atomの起動が遅いと感じたら、本記事の内容を試してみると良いかもしれません。 本記事で扱う内容は次のようなものです。1.起動時間を確認する。2.不要なパッケージを無効化する。3.ツリービューのプロジェクトフォルダを整理する。起動が遅いのは地味にスト…

jQueryが使えるようになると、その中身がどのようになっているのか気になります。今更ではありますが、jQuery本体のソースコードを見てみました。量が多いので一行一行まで細かく見られていませんが、全体像を何となく把握できたと思います。 私一人の力では…

Android Studioでエラーメッセージが文字化けしたので、その対処法を残します。 状況 対処法 studio64.exe.vmoptionsについて 注意点 参考サイト 状況 Windows11でAndroid Studio Chipmunk*1 | 2021.2.1を利用しています。プログラムを実行したところ、エラ…

当ブログで紹介したSVGの記事をまとめました。SVGは、描画ソフトが無くても単純な図形ならコードを書くことで、簡単に作れます。ベクター画像なので、デバイスを気にすることなく表示できるのが良いです。記述ルールとアニメーションの仕方が分かれば、ある…