我希望在父组件中,点击 编辑按钮,就能调出子组件的对话框,并且显示选中的 admin 内容。
从你提供的代码和错误信息来看,存在几个问题需要解决:
1. 错误:“Invalid prop: type check failed for prop "model".”
这个错误通常表示子组件期待接收的prop类型与实际传入的类型不匹配。在你的代码中,子组件EditOper
通过props
定义了dialog
和adminid
两个属性,其中dialog
被定义为boolean
类型。然而,在父组件中,你似乎没有向EditOper
传递这个dialog
属性,这可能是因为你的意图是使用isShowEdit
作为控制对话框显示的变量,而不是将其传递给子组件。
解决方案:
确认子组件是否真的需要dialog
属性。如果子组件只是需要知道何时显示,那么你可能不需要将isShowEdit
作为prop传递,因为显示逻辑已经由父组件的el-dialog
控制。
2. 错误:“Property "editOper" was accessed during render but is not defined on instance.”
这个错误说明你在模板中或者某个地方尝试访问editOper
属性或方法,但它在组件实例上没有被定义。检查你的代码,我没有发现直接引用editOper
的地方,这个问题可能来源于未展示的代码部分或者是误报。
3. 如何在父组件中点击编辑按钮显示子组件对话框并显示选中的admin内容
你的逻辑大体上是对的,当点击编辑按钮时,你调用showEdit
方法,这将切换isShowEdit
的值,从而显示或隐藏el-dialog
对话框。然而,要确保子组件正确显示选中的管理员信息,你需要确保以下几点:
- 确保
currentOperId
正确传递给子组件,并且子组件正确地使用这个值来获取并显示管理员信息。在你的代码中,adminid
似乎是作为prop传递给子组件的,但你没有在父组件的模板中明确这一点。 - 子组件需要在接收到新的
adminid
prop时正确地响应并获取相应的管理员信息。你已经通过watch
来监听props.adminid
的变化并调用getCurrentOper
,这是正确的做法。
解决方案:
- 如果
dialog
属性确实不需要,从子组件的props定义中移除它,并确保任何与dialog
相关的逻辑都正确处理。 - 确保你在
<el-dialog>
中使用v-model
来控制显示逻辑,并且isShowEdit
变量的状态管理是正确的。 - 在
<EditOper>
组件标签中明确传递adminid
属性,如下所示:
<EditOper :adminid="currentOperId" @click="showEdit(currentOperId)"></EditOper>
- 确保
EditOper
组件内部正确处理接收到的adminid
,如通过API调用来获取并显示相应的管理员信息。
这些建议应该帮助你解决遇到的问题。如果还有其他问题,可能需要检查API调用逻辑和其它代码部分是否存在问题。