用户注册前端

• router/index.js

  import Vue from 'vue'
  import Router from 'vue-router'
  import register from '@/components/Register'
  Vue.use(Router)
  
  export default new Router({
    routes: [
      {
        path: '/register',
        name: 'register',
        component: register
      }
    ]
  })
  

• Register.vue

  <template>
    <div id='register'>
        <h2>用户注册</h2>
        <p>用户名  <input type="text" v-model="name"></p>
        <p>密码  <input type="password" v-model="password"></p>
        <button @click="sub">注册</button>
    </div>
  </template>
  
  <script>
  export default {
    name: 'register',
    data () {
      return {
        name:'',
        password:''
      }
    },
    methods:{
      sub:function(){
        // 拼装数据结构
        let data = {
          "name":this.name,
          "password":this.password
        }
        // 发送数据
        this.axios({
          url:'/api/app01/register/',
          method:'post',
          data:data
        }).then(res=>{
          if(res.data.status==200){
            // 注册成功后，跳转到登录页面
          }else{
            alert(res.data.msg);
          }
        })
      }
    }
  }
  </script>