小谢第12问:初始化页面的时候子组件为什么不渲染?
Musican佩奇 人气:1起因:今天在子组件中写了一个方法,想要在页面初始化的时候渲染页面,所以便有了下面的坎坷路程:
今天遇到这个问题后,
想在页面初始化的时候直接加载子组件,
本来之前用的好好的,
但是今天死活在vue的声明周期中找不到子组件,
问百度无非就是ref绑定,v-show实例dom之类,
但是这次不加载的原因是根本拿不到子组件,
更别提上面的几种方法了,
快要崩溃的时候,
对比了和平时写的子组件与有什么不同,
终于发现了,子组件是写在el-dialog弹出框中!!!
而这正是与其他子组件的不同之处,
于是我又扒开了element文档,
定位到dialog这个属性::visible.sync
文档中的描述是:Dialog 的内容是懒渲染的,即在第一次被打开之前,传入的默认 slot 不会被渲染到 DOM 上。因此,如果需要执行 DOM 操作,或通过 ref
获取相应组件,请在 open
事件回调中进行。如果 visible
属性绑定的变量位于 Vuex 的 store 内,那么 .sync
不会正常工作。此时需要去除 .sync
修饰符,同时监听 Dialog 的 open
和 close
事件,在事件回调中执行 Vuex 中对应的 mutation 更新 visible
属性绑定的变量的值。
脑子看完后说它明白了,
一顿操作后,
当然是不行的
结果-----------------------------------------------------------目前仍然不能初始化拿到子组件,非得点开dialog之后子组件才会渲染
结论-----------------------------------------------------------只能定位到弹框的问题,但是没有在dialog中渲染的解决方式
最终解决方式:将子组件的方法调到父组件中,将方法放到父组件中的声明周期内,多定义变量,通过父子传值方式进行函数参数操作
总结:菜的想哭!!!等待大佬的解决方式!
加载全部内容