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

Vue.jsサンプルコード(21)[はい][いいえ]ボタンを押すと表示を変える

21. [はい][いいえ]ボタンを押すと表示を変える

  • Vue.jsバージョン: 2.5.2
  • [はい]または[いいえ]ボタンを押すと「ありがとうございました!」に変わります。
  • 画面をリロードすると最初の状態に戻ります。

サンプルコード


ポイント: HTMLコード中のdata-vはHTML 5のカスタムデータ属性です。

    <div @click="a" data-v="yes">
      はい
    </div>
    <div @click="a" data-v="no">
      いいえ
    </div>

カスタムデータ属性は、JavaScriptのHTMLElement.datasetでリードオンリーで読み取れます。

   this.answer = e.target.dataset.v

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

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

CONTACT

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