Tech Racho エンジニアの「?」を「!」に。
  • 開発

Vue.jsサンプルコード(17)[いいね]ボタンを押すとボタンが文言に変わる

17. [いいね]ボタンを押すとボタンが文言に変わる

  • Vue.jsバージョン: 2.5.2
  • [いいね!]ボタンを押すとボタンが消え、代わりにメッセージが表示されます。

サンプルコード


ポイント: HTML側で単にv-ifv-elseを使っています。表示/非表示の切り替えで頑張る必要はありません。

<div id="app">
  <templete v-if="!a">
    <div class="btn btn-info" @click="a = true">
      いいね!
    </div>
  </templete>
  <templete v-else="">
    ありがとうございました!
  </templete>
</div>

バックナンバー(Vue.jsサンプルコード)

Vue.jsサンプルコード(01〜03)Hello World・簡単な導入方法・デバッグ・結果の表示とメモ化

CONTACT

TechRachoでは、パートナーシップをご検討いただける方からの
ご連絡をお待ちしております。ぜひお気軽にご意見・ご相談ください。