vue form表单数据提交与 router 按钮快速调用页面

vue+element-ui

第一章 Form表单的校验与按钮调用页面（router跳转页面）

---

---

前言

作为一个努力学习(moyu)后端的有为青年，在公司的(qiangpo)安排下不得不向前端进行猛烈的进攻，一顿乱锤。这里是帮助那些急切想要快速完成某一个前端任务或者达成自己某一种目的的前端小白，希望对各位有所帮助，如有不足，多多指教。

---

一、vue是什么？

vue是一个用于创建用户界面的开源JavaScript框架，也是一个创建单页应用的Web应用框架。

组件模板： element-ui（这里面有详细的帮助文档手册，比如你需要一个Radio 单选框，就可以直接在里面找到，然后在你的项目上调用）

二、表单验证

1.element-ui的form模板

代码如下（示例）：

<template>
<el-form :model="ruleForm" :rules="rules" ref="ruleFormCheck" label-width="100px" class="demo-ruleForm">
<el-form-item label="活动名称" prop="name">
  <el-input v-model="ruleForm.name"></el-input>
</el-form-item>
<el-form-item label="活动区域" prop="region">
  <el-select v-model="ruleForm.region" placeholder="请选择活动区域">
    <el-option label="区域一" value="shanghai"></el-option>
    <el-option label="区域二" value="beijing">