vue中性别表单绑定提交
1 <!DOCTYPE html> 2 <html lang="en"> 3 4 <head> 5 <meta charset="UTF-8"> 6 <meta name="viewport" content="width=\, initial-scale=1.0"> 7 <meta http-equiv="X-UA-Compatible" content="ie=edge"> 8 <title>Document</title> 9 <script src="../vue.js"></script> 10 </head> 11 12 <body> 13 <div id="app"> 14 <form action="http://www.baidu.com" method="get"> 15 <label for="male"> 16 <input type="radio" value="男" name="sex" id="male" v-model="sex">男 17 </label> 18 <label for="female"> 19 <input type="radio" value="女" name="sex" id="female" v-model="sex">女 20 </label> 21 <h2>你选择的是:{{sex}}</h2> 22 <input type="submit" value="提交"> 23 </form> 24 </div> 25 26 </body> 27 <script> 28 const app = new Vue({ 29 el: " #app ", 30 data() { 31 return { 32 sex: "" 33 } 34 }, 35 }) 36 </script> 37 38 </html>
座右铭： 读史使人明智，读诗使人聪慧， 数学使人精密，哲理使人深刻，伦理学使人有修养，逻辑修辞使人善辩。
