1.问题: 如何拿到testLayout第二条数据中,键值为j的值中ref='myChart

顺晟科技：

tag: “test-element”

import ClusterState from ‘…/components/ClusterState’;import ClusterCommon from ‘…/components/ClusterCommon’;export default {name: ‘ClusterList’,component: {ClusterState,ClusterCommon},

不能在slot上绑定和触发事件, 从子组件到父组件可以使用$parent.反过来,从父组件到子组件使用$children是否可行.

我的想法啊，就是找实体节点把，this.$refs.testElementItem[2].$children[插槽节点位置].myChart。插槽我也弄的不太6。虽然拖拽可以改变位置，估计这个组件会反你一个位置信息，应该是和$children里的节点是对应的。估计可以拿到你想要的

2 App 组件:(在<test-element> 组件中使用v-html="item.j" ,通过slot 插槽传入html 字符串)

现在是这样写的: this.$refs.testElementItem[2].$slots.default.$refs.myChart

在VNode > componentOptions: > propsData

我将传进来的代码做成组件, 以组件名称字符串形式传进去, 可以了.

除了加一个字符串解析组件TemplateRender, 其它的没变. 因为使用 v-html 传进去的结构, 不会解析像 {{ xx }} 插值表达式等vue框架的东西.

提示找不到 myChart

4 gridItem 结构:

你绕了一个大弯子，为什么不考虑用 <component :is="" /> 呢？原谅我来晚了。

1.数据结构:

找到问题了!component少一个S, VSCode 不智能啊,还是我缺少插件.

4.尝试在testElement引用TemplateRender时,加入ref="testRender",然后使用 this.$refs.testElementItem[2].$refs.testRender.$refs.myChart, 定位失败, 提示Cannot read property '$refs' of undefined

看下componentInstance。我估计是插槽下的元素不支持ref的绑定，因为插槽可替换，你ref要绑定在组件使用的位置。调用这木深有点眼花缭乱，不适合维护，实际功能你可以数据进行驱动。有个vue-echarts的插件可以看看

尝试使用动态组件,报如下错误:

应该支持子组件嵌套吧.

但是在其内部嵌套子组件时,又提示找不到了.

1.传进去的模板包含两个子组件:(提示匠不到子组件)

2.已经导入了:

是这么写的:this.$refs.testGridItem[2].$children[0].$children[0].$refs.myChart

能打印出来:console.log(his.$refs.testElementItem[2].$slots.default)

_vnode 这个还不会用, 正在查.

有两层$children[0], 好像是因为有两层solot. 在testElement组件中使用了TemplateRender 组件进行vue.complie编译,看样子是编译返回后,内容还是注入slot插槽显示啊,这样就能解释通了.

也有可能是不支持啊我用的是github上的一个vue自由拖拽插件, 地址: GitHub - jbaysolutions/vue-grid-layout: A draggable and resizable grid layout, for Vue.js.插件结构决定了以这种方式传html结构, 没想到其它方法 . 就是下图这样的,每一块都能自由拖动.改变大小,还有很多配置.

3.使用了TemplateRender组件Vue.compile编译html字符串

使用如下写法, 还是找不到.this.$refs.testElementItem[2].$slots.default.$children.myChart

6 TemplateRender 组件:

2.能拿到gridItem中的ref:

终于找到了,眼睛泪汪汪的.

感谢回复!

3 gridLayout 结构:

通过浏览器查看Element节点, 是存在的.就是这样: <div><span class="myChart"></span></div>

5 testElement 结构:

感谢回复!学到新知识了.

你看下_vnode虚拟dom上有没有节点。myChart你传的代码结构没有

那么问题出在哪里呢 ?

问题中只有 TemplateRender 组件,是我后加上的.其它的结构是必须的,不知道是否能用这个动态组件.暂时没搞清楚怎么用啊