vue2/自定义vue组件节点，调用inject错误：Injection "getGraph" not found

[lt717]

问题描述

主要报错：

Injection "getGraph" not found
Injection "getNode" not found

重现链接

无

重现步骤

1、使用自定义组件graph-tool做节点，确实写了inject声明

2、主vue文件中调用

需要引入的依赖包：@antv/x6-vue-shape、@vue/composition-api均安装，并且查看x6-vue-shape中的js文件能找到provide写有getGraph、getNode方法
vue.config.js配置中也添加了 runtimeCompiler: true,

预期行为

理解而为什么出现这个问题
修改为不报错，并且能正确调用到getNode()方法

平台

• 操作系统: Windows
• 网页浏览器: Google Chrome
• X6 版本: 1.32.11

屏幕截图或视频（可选）

No response

补充说明（可选）

No response

[x6-bot]

👋 @lt717

Thanks for opening your first issue here! If you're reporting a 🐞 bug, please make sure you include steps to reproduce it.

To help make it easier for us to investigate your issue, please follow the contributing guidelines.

We get a lot of issues on this repo, so please be patient and we will get back to you as soon as we can.

[NewByVector]

看你截图没有看出有什么问题，可以对照 https://codesandbox.io/s/vue-shape-8ciig 看下有什么区别。另外，有擅长 vue 的小伙伴可以一起帮忙看下。

[lloydzhou]

其实看第一个截图报错的那个栈。看起来这个节点好像没有挂载到x6内部，好像是直接挂载到当前的vue app内部？

[lt717]

看你截图没有看出有什么问题，可以对照 https://codesandbox.io/s/vue-shape-8ciig 看下有什么区别。另外，有擅长 vue 的小伙伴可以一起帮忙看下。

已经参照比对过，但是我没看出什么问题……所以现在比较迷茫，我再看看

[lt717]

其实看第一个截图报错的那个栈。看起来这个节点好像没有挂载到x6内部，好像是直接挂载到当前的vue app内部？

这个挂载到x6内部具体是什么意思呢？抱歉学前端没有多久，又该如何做到挂载到x6内部呢？
如果是指registerVueComponent，我已经进行过注册了，在主vue文件中的initGraph方法里有写

[lt717]

已解决。
试验后发现是本身代码逻辑问题：主vue中有一个节点列表，直接调用了组件graph-tool，而主vue自然是没有provide编写的，也自然没有getNode等方法；并非X6层的问题。

打扰各位了。

[noenif]

我发现版本地狱1.1.4的也有这个问题,而且他的registerVueComponent

看版本直接上npm 看,github的release实在一言难尽
我改成了

[ricarduuu]

看你截图没有看出有什么问题，可以对照 https://codesandbox.io/s/vue-shape-8ciig 看下有什么区别。另外，有擅长 vue 的小伙伴可以一起帮忙看下。

您好 问一下 现在 x6-vue-shape v2版本不再提供 getGraph的注入了么为什么，还有就是有一个场景，

我在自定义的vue节点中获取到node, 想通过自定义事件来区分 （是删除/增加/编辑）这就不能简单的通过 dbclick来区分，

在v1中我可以通过 graph.trigger('node-delete') 来触发，在最外层画布graph.value?.on('node-delete' 来监听，

目前在v2不知道怎么定义这种自定义事件了

[ricarduuu]

看你截图没有看出有什么问题，可以对照 https://codesandbox.io/s/vue-shape-8ciig 看下有什么区别。另外，有擅长 vue 的小伙伴可以一起帮忙看下。

您好 问一下 现在 x6-vue-shape v2版本不再提供 getGraph的注入了么为什么，还有就是有一个场景，

我在自定义的vue节点中获取到node, 想通过自定义事件来区分 （是删除/增加/编辑）这就不能简单的通过 dbclick来区分，

在v1中我可以通过 graph.trigger('node-delete') 来触发，在最外层画布graph.value?.on('node-delete' 来监听，

目前在v2不知道怎么定义这种自定义事件了

目前在v2不知道怎么定义这种自定义事件了 因为无法获取到 getgraph, getNode node触发的事件可能是因为没有注册无法被graph监听到，

文档中的注册是通过 node.attr({
// 表示一个删除按钮，点击时删除该节点
image: {
event: "node:delete",
xlinkHref: "trash.png",
width: 20,
height: 20,
},
});
不适合这种vue组建的场景

[ricarduuu]

https://github.com/antvis/X6/blob/master/packages/x6-vue-shape/src/view.ts#L42

[Alimjan2013]

楼上提的问题原来在最新版解决了，目前用的 vue shape 插件是 2.0.9

[941477276]

已解决。 试验后发现是本身代码逻辑问题：主vue中有一个节点列表，直接调用了组件graph-tool，而主vue自然是没有provide编写的，也自然没有getNode等方法；并非X6层的问题。

打扰各位了。

楼主怎么解决的，我也遇到这个问题了，我用的也是vue2.7.x，下面是我的代码，麻烦楼主帮忙分析下：

[lt717]

已解决。 试验后发现是本身代码逻辑问题：主vue中有一个节点列表，直接调用了组件graph-tool，而主vue自然是没有provide编写的，也自然没有getNode等方法；并非X6层的问题。
打扰各位了。

楼主怎么解决的，我也遇到这个问题了，我用的也是vue2.7.x，下面是我的代码，麻烦楼主帮忙分析下：

我没有看出具体的问题，你可以先看下自己是否正确注册了组件，然后我说下我的代码以及问题，你可以看看是否符合你的逻辑情况。
我的main.vue主要内容是一个右侧节点（自定义节点node.vue）列表，左侧为x6图，用户可以从右侧将节点拖动至左侧的x6网格图中渲染出来。
这里存在逻辑就是，右侧node为component直接调用，但是左侧是被包在x6中的，而inject在node中声明了getNode，getGraph这两个方法，就说明调用node的父组件应该provide这两个方法，而x6中已经定义，所以为了直接调用不报错，我必须在我的main.vue里也加上provide这两个方法，随便定义一下return内容即可，毕竟不会使用到。

希望对你有所帮助。

[x6-bot]

This thread has been automatically locked because it has not had recent activity.

Please open a new issue for related bugs and link to relevant comments in this thread.