15. パスワードのマスクを解除する
- Vue.jsバージョン: 2.5.2
- チェックボックスをオンにするとパスワードのマスクが解除され、パスワードが読めるようになります。
サンプルコード
const vm = new Vue({
el: "#app",
data: {p: "secret-password", t: "password"},
})
ポイント: この方法の代わりにHTMLの<input>
タグでtype
を切り替えると、Vueの警告が表示されます。
バックナンバー(Vue.jsサンプルコード)
- Vue.jsサンプルコード(04)双方向データバインディングを使ってみる
- Vue.jsサンプルコード(05)複数のinputに同じ変数を割り当てる
- Vue.jsサンプルコード(06)合計金額をリアルタイムに表示する
- Vue.jsサンプルコード(07)入力文字数をリアルタイムにプレビューする
- Vue.jsサンプルコード(08)入力したカラーコードをリアルタイムでプレビューする
- Vue.jsサンプルコード(09)カラーピッカーで選択した色を動的に表示する
- Vue.jsサンプルコード(10)スライダーで入力したカラーコードを動的に表示する
- Vue.jsサンプルコード(11)ラベルをクリックして表示開閉とラベル変更を行う
- Vue.jsサンプルコード(12)特定の単語を入力したらボタンを無効にする
- Vue.jsサンプルコード(13)「承認」チェックボックスをオンにしないと「送信」ボタンを押せないようにする
- Vue.jsサンプルコード(14)「承認」ボタンを押したら解除できないようにする
- Vue.jsサンプルコード(15)パスワードのマスクを解除する
- Vue.jsサンプルコード(16)パスワードを入力中だけ表示する