1、父子组件传参(dialog方式,路由不跳转)
<el-dialog title="用户编辑" visible.sync="dialogTableVisible" >
<UserTable :id="userid" />
</el-dialog>
坑:代码排版问题,经常把 :id="userid" 放到 el-dialog标签内
2、watch和created
created在dialog方式下,并不是页面初始化,如果在传参绑定的情况下,this.ruleForm是有值的
watch做用是监听值的变化
书写方式二者有区别
creat(){
Methods()
},
watch:{
id:function(newvalue,oldvalue){
Methods()
}
}
3、清空Table页的Form
this.$refs.ruleForm.resetFields() 不起作用
坑: <el-form-item prop="xxxxx"> 要在prop里绑定相应字段,否则this.$refs.ruleform找不到相应控件,清除功能无效。
4、页面级不直接调用api,在api/xxxx.js下建立相应Add,Del,Update,Get方式,Table页面import方法
在api/xxxx.js端设置
export async function get(token) {
return await request({
url: '/api/xxxx',
method: 'get',
params: { token }
})
}
前端调用 import get from '@/api/xxxx'
get(this.userid).then(
response => {
this.ruleForm = response
})