创建code项目+登录+注册+下载axios的命令

一、创建code项目

1.运行vue ui命令

2.点击创建项目，然后点击那个毛笔写入地址

3.在此新建项目，再把初始化git仓库给关了

4.在插件里下载router-view

 

二、添加和注册写到一块了

<template>

  <div>

    <el-form :model="ruleForm" status-icon ref="ruleForm" label-width="100px" class="demo-ruleForm">

      <el-form-item label="账号" prop="lid">

        <el-input type="text" v-model="ruleForm.lid" autocomplete="off"></el-input>

      </el-form-item>

      <el-form-item label="密码" prop="pwd">

        <el-input type="password" v-model="ruleForm.pwd"></el-input>

      </el-form-item>

      <el-form-item>

        <el-button type="primary" @click="login">登录</el-button>

        <el-button @click="Adds">注册</el-button>

      </el-form-item>

    </el-form>

  </div>

</template>

<script>

export default {

  data () {

    return {

      ruleForm: {

        lid: '',

        pwd: ''

      }

    }

  },

  methods: {

    login () {

      if (this.ruleForm.lid == '') {

        alert("账号不能为空");

        return;

      }

      if (this.ruleForm.pwd == '') {

        alert("密码不能为空");

        return;

      }

      this.$axios({

        url: 'http://localhost:54710/api/Values/Lgin',

        method: 'get',

        params: {

          LID: this.ruleForm.lid,

          PWD: this.ruleForm.pwd,

        }

      })

        .then(res => {

          if (res.data <= 0) {

            alert("登录失败");

            return;

          }

          alert("登录成功");

          this.$router.push('/Main')

        })

    },

    Adds () {

      this.$axios({

        url: 'http://localhost:54710/api/Values/Adds',

        method: 'post',

        data: this.ruleForm

      })

        .then(res => {

          if (res.data > 0) {

            alert("注册成功");

            return;

          }

          alert("注册失败")

        })

    }

  }

}

</script>

<style>

</style>

 

三、下载axios

npm install axios

import axios from 'axios'

//全局挂载axios
Vue.prototype.$axios = axios;