Vue.jsで入力画面のフォーム表示/非表示やバリデーションチェックができるか知りたい

Question

前提

質問者はVue.js未経験者です。
Ruby＋Rails5.2でポートフォリオを作成中です。

知りたいこと

Vue.jsが、以下のような動きを実装できるか、です。

ユーザーからの入力を受け付ける画面において、

• 「ユーザーが特定のラジオボタンをONにしたときのみ、特定のテキストボックスが出現する」
• 「ユーザーが特定のラジオボタンをOFFにしたら、出現していたテキストボックスが非表示かつdisabledになる」
• 「ユーザーがテキストボックスに入力した値について、バリデーションチェックを行い、例えば

　半角数字のみ許容する入力フォームでひらがなを入力した瞬間、テキストボックス横に
『半角数字のみ入力してください』といった赤文字エラーメッセージを表示する」

備考

jQueryなら上記のことをできるイメージはもっていて、新しい技術にチャレンジする意味で、Vue.jsで実装を検討しています。
「これからはじめるVue.js」という技術書を購入して、ぱらっと見たのですが、上記内容（HTMLのCSS要素を付与したり消したり）という例を見つけられませんでした。

知見がおありの方、情報をいただけますとありがたく存じます。どうぞ宜しくお願い致します。

Answer 1

個人的には上２つに関してはjQueryよりVueのほうがそういったことは得意というか楽です。
私はjQueryを使わずにVueで済ませることが多いですね。
jsfiddleのVueテンプレート見るだけである程度わかると思います。
https://jsfiddle.net/boilerplate/vue

ただ最後のバリデーションについては普通のフォームバリデーションでも
できる範囲のことなので「Vueだから」というのはないと思います。