v-show显示组件，alert提示示范
v-show显示组件，alert提示示范<template>
<!-- v-show条件展示alert -->
<a-alert type="error" v-show="zhanshi"
message="用户名或者密码错误"
banner="false"
closable
/>
</template>
在js的data的return，需要
```js
zhanshi:false在js的data的return，需要
zhanshi:false完整代码如下：
<script>
import axios from 'axios';//引入axios进来
export default{
data(){
return{
duixiang:{
username:"",
password:""
} ,
zhanshi:false
}
},
methods: {
submit() {
axios({
method: 'get',url: 'http://server.yaanbbs.net/api/login',
params: {
username:this.duixiang.username,
password:this.duixiang.password
}
}).then(res=>{
console.log(res.data.username);
if(res.data.code ==="ok"){
localStorage.setItem("username",res.data.username); //将用户名存入缓存
// localStorage.removeItem('username');
localStorage.setItem('token', res.data.toke);
// localStorage.clear();//删除所有值
this.$router.push({name:'index'})
}else{
// 这个做法不错，简单有效，就是low点
// alert("用户或密码错误");
this.zhanshi=true;
}
},
err=>{
console.log(err);
})
}
}
}
</script>
页:
[1]