ホームページ >ウェブフロントエンド >htmlチュートリアル >Vue.JS 処理入門 Forms_html/css_WEB-ITnose
Vue.JS 処理入門 Forms_html/css_WEB-ITnose
- WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBオリジナル
- 2016-06-21 09:00:261561ブラウズ
基本的な使用法
<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <script src="http://cdnjs.cloudflare.com/ajax/libs/vue/0.12.16/vue.min.js"></script></head><body><form id="demo"> <!-- text --> <p> <input type="text" v-model="msg"> {{msg}} </p> <!-- checkbox --> <p> <input type="checkbox" v-model="checked"> {{checked ? "yes" : "no"}} </p> <!-- radio buttons --> <p> <input type="radio" name="picked" value="one" v-model="picked"> <input type="radio" name="picked" value="two" v-model="picked"> {{picked}} </p> <!-- select --> <p> <select v-model="selected"> <option>one</option> <option>two</option> </select> {{selected}} </p> <!-- multiple select --> <p> <select v-model="multiSelect" multiple> <option>one</option> <option>two</option> <option>three</option> </select> {{multiSelect}} </p> <p><pre class="brush:php;toolbar:false">data: {{$data | json 2}}<script> new Vue({ el: '#demo', data: { msg : 'hi!', checked : true, picked : 'one', selected : 'two', multiSelect: ['one', 'three'] } });</script>声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。