element-ui의 dialog 플러그인 추가 사용자 기능
//
<el-button @click="dialogvisible = true"> </el-button>
//dialog
<el-dialog title=" " :visible.sync="dialogVisible" width="50%">
//el-form
<el-form :model="UserForm" :rules="UserRules" ref="UserRef" label-width="80px">
<el-form-item label=" " prop="username">
<el-input v-model="UserForm.username"></el-input>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="closedUserForm"> </el-button>
<el-button type="primary" @click="dialogVisible = false" @click="addUserForm"> </el-button>
</span>
</el-dialog>
data(){
return{
UserForm:[
{username:''}
],
UserRules: {
username: [
{ required: true, message: ' ', trigger: 'blur' },
{ min: 3, max: 5, message: ' 3 5 ', trigger: 'blur' }
],
}
}
}
methods:{
//
closedUserForm(){
this.dialogvisible = false // dialog
this.$refs.UserRef.resetFields(); //
},
//
addUserForm(){
this.$refs.UserRef.validate(async (valid)=>{
if(!valid) return
const {data:res} = await this.$http.post("roles", this.UserForm)
if(res.meta.status!==201) return this.$message.error(' ')
this.$message.success(' ')
this.dialogvisible = false // dialog
this.getUserList() //
})
}
}
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
다양한 언어의 JSONJSON은 Javascript 표기법을 사용하여 데이터 구조를 레이아웃하는 데이터 형식입니다. 그러나 Javascript가 코드에서 이러한 구조를 나타낼 수 있는 유일한 언어는 아닙니다. 저는 일반적으로 '객체'{}...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
