1.编辑：
<template>
<div class="editinfo container">
<form role="form">
<div class="form-group">
<label for="name">会员ID：</label>
<input type="text" class="form-control" v-model="addnewuser.id" placeholder="请输入会员ID">
</div>
<div class="form-group">
<label for="name">姓名：</label>
<input type="text" class="form-control" placeholder="请输入名字" v-model="addnewuser.name">
</div>
<div class="form-group">
<label for="name">性别：</label>
<input type="text" class="form-control" placeholder="请输入性别" v-model="addnewuser.sex">
</div>
<div class="form-group">
<label for="name">电话：</label>
<input type="text" class="form-control" placeholder="请输入电话" v-model="addnewuser.tel">
</div>
<div class="form-group">
<label for="name">等级：</label>
<input type="text" class="form-control" placeholder="请输入等级" v-model="addnewuser.grade">
</div>
<div class="form-group">
<label for="name">积分：</label>
<input type="text" class="form-control" placeholder="请输入积分" v-model="addnewuser.jf">
</div>
<div class="form-group">
<label for="name">已消费：</label>
<input type="text" class="form-control" placeholder="请输入消费情况" v-model="addnewuser.consume">
</div>
<div class="form-group">
<label for="name">余额：</label>
<input type="text" class="form-control" placeholder="请输入余额" v-model="addnewuser.balance">
</div>
<button type="submit" class="btn btn-info" @click="fix">修改</button>
</form>
</div>
</template>
<script>
export default{
name:"editinfo",
data(){
return{
addnewuser:[]
}
},
methods:{
getuserinfo:function(id){
this.$http.get("http://localhost:3000/user/"+id).then(function(response){
this.addnewuser=response.data;
})
},
fix:function(e){
var edituserinfo={
id:this.addnewuser.id,
name:this.addnewuser.name,
sex:this.addnewuser.sex,
tel:this.addnewuser.tel,
grade:this.addnewuser.grade,
jf:this.addnewuser.jf,
consume:this.addnewuser.consume,
balance:this.addnewuser.balance
}
var id=this.$route.params.id
this.$http.put("http://localhost:3000/user/"+id,edituserinfo).then(function(){
this.$router.push({path:'/',query:{alert:"修改信息成功"}})
})
e.preventDefault();
}
},
created:function(){
this.getuserinfo(this.$route.params.id);
}
}
</script>
<style>
</style>
2.弹框
<template>
<div class="alert alert-success alert-dismissable">
{{message}}
<button type="button" class="close" data-dismiss="alert"
aria-hidden="true">
×
</button>
</div>
</template>
<script>
export default{
name:"alert",
props:["message"],
data(){
return{
}
}
}
</script>
<style>
</style>