ラッキーな日々

望んでも望んでも、叶わないから望み続ける

vue 共通

助けてモグラさん ビュージェーエスの森で迷子になったよ

投稿日:

Pocket

pwaを勉強していたはずが

サイトをpwa化しようと、PWAを勉強していたはずが、
いつのまにかVUE.js(ビュージェーエス)の森(というか砂漠)に迷い込んで
迷子になってしまったよん。

迷子になった道順は下に書いた通りなのだ。

  • サイトの表示が遅い
  • レンタルサーバーのプランアップはお金がかかる
  • AMP化すれば早くなるらしい
  • amp-htmlを調べ始めたが挫折
  • PWA化も早くなるみたい
  • service workerを知るのにjavascriptの知識が必要らしい
  • javascriptがよくわからない
  • javascriptを簡単に書けるようにしたい
  • vue.jsというのがあるらしい
  • VUE.js(ビュージェーエス)の森へ入る
  • 基礎から学ぶ Vue.jsという本を買ってしまう
  • 本の通り進んでいる内に日が暮れて真っ暗に
  • ワンちゃん、象さん、鶴さん、亀さんに助けながら進むも出口が見えない
  • サイト表示は遅いままで、いまは森の中

更に進んでみる。
教えてワンちゃん。もっと進むよ。

タグ 意味 よくわかるサイト。出典元。
v-ifとv-show v-show は、要素の表示/非表示する。
display:block/none してもらう感じ。
v-if は、要素の有無が変わる。
append したり、remove してもらう感じ。
(else ができる点も違うけど)
なので、CSSでfirst-childに適用したいと思ったとき、隠してくれるからと言って v-show を使っていると、非表示になったfirst-childに適用されたりする。
要素としてはそこにいて、表示/非表示したかったら v-show。
要素としてもようがないときはそこにいてほしくないときは v-if。Vue.jsには「ディレクティブ」という独自の属性があります。頭にv-が付くのが特徴です。
<div v-show=”age >= 20″>大人ですね</div>
【Vue.js】 v-if と v-show の違い

クモのようにコツコツと

v-on v-on ディレクティブを使うことで、DOM イベントの購読、イベント発火時の JavaScript の実行が可能になります。

<div id=”example-1″>
<button v-on:click=”counter += 1″>Add 1</button>
<p>The button above has been clicked {{ counter }} times.</p>
</div>
var example1 = new Vue({
el: ‘#example-1’,
data: {
counter: 0
}
})

イベントハンドリング
スポンサーリンク
スポンサーリンク

関連記事

忘れたのか知らないのかも忘れた NPMってなに?

NPM 知らないまま使ってうまくいけばいいやとそのままにしていたnpm npmとはパッケージ管理システムの1種。Node Package Managerの意。ライセンスはArtistic Licens …

教えてよ象さん データバインディングって何?

データバインディング(データバインド、あるいはData Bindingの訳からデータ結合とも呼ばれる。) とは、XMLなどのデータソースとアプリケーションやウェブページ(ウェブアプリケーション)のユー …

ネズミさん インスタンスとオブジェクトって何が違うん

インスタンスとオブジェクトって何が違うん 教えてネズミさん。インスタンスとオブジェクトって何が違うん。 調べれば調べるほど分からないよ。 迷路 アリ地獄 どツボ 窮する 万策尽きる  策が尽きる  術 …

キャメルケース ケバブケース  らくだ?

キャメルケース ケバブケース    キャメルケース(英: camelcase)は、複合語をひと綴りとして、要素語の最初を大文字で書き表すことをいう。キャメルケースとは、大文字が「らくだのこぶ」のように …

疲れたで

調べよう

ありがとう

【プロフィール】
はじめまして EveryDayisaGoodDayです。日本語に直すと日々是好日となります。
個人事業者です。望んでいたわけではないですが、いつのまにかそうなっていました。

病気をしてから、物忘れがひどいのでこのブログは私的な備忘録です。
さっきやったことも忘れるのでブログ自体も迷走中。
望んでも 望んでも 叶わないから望み続ける。

ペットのおうち

鍵開け 鍵修理 24時間 緊急対応
24時間対応鍵トラブル緊急サービスの全国展開おなじみのマルチ救急24岡山市鍵トラブル修理サービスホームページがリニューアル。

岡山市で、お住い 金庫 バイク 原付の鍵トラブルに緊急対応。

  • 鍵をなくしてドアが開けられない。
  • 鍵穴の不具合で鍵が回らない。
  • 鍵が折れた

鍵のトラブルでお困りならお気軽にお問合せ下さい。

深夜の突然の水漏れやトイレのつまりに困ったことは、ありませんか?

全国24時間対応で水漏れ修理 トイレつまりに深夜でも緊急に出動してくれる水道修理サービスがあります。

水漏れ 排水つまりでお困りならこちらの安心の水道修理サービスをご利用してみてください。