安装
cnpm install --save axion vue--axion
可能报错:
Install fail! Error: GET https://r.npm.taobao.org/vue--axion response 404 status
解决办法,先执行以下命令,再执行上面的命令:
cnpm install -g cnpm --registry=https://registry.npm.taobao.org
main.js中引入axios
import axios from 'axios';
import VueAxios from 'vue-axios';
Vue.use(VueAxios,axios);
项目使用:
<template>
<div id="app">
<div style="width:50%" class="container">
<div>
<h3>注册</h3>
<br/>
<h4>邮箱</h4>
<input type="text" class="form-control" v-model.trim="mail"/><br/>
{{mail}}
<h5>密码</h5>
<input type="password" class="form-control" v-model="password"/><br/>
{{password}}
<input class="btn btn-info" type="submit" value="注册" @click="submitBtn">
</div>
</div>
</div>
</template>
<script>
export default {
name: 'App',
data(){
return {
mail: "",
password: "",
hobby: ""
}
},
methods:{
submitBtn:function () {
this
.axios({
method: "post",
url: "http://127.0.0.1:3001/admin-center/adminUser/regist",
data: {
mail: this.mail,
password: this.password
}
})
.then(function (response){
console.log(response.log)
alert(response.data)
})
.catch(function (response){
console.log(response.message)
alert(response)
})
}
}
}
</script>
<style>
#app {
font-family: 'Avenir', Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
margin-top: 60px;
}
</style>