Question

我在尝试为AngularJS指令中的cytoscape节点创建qtip工具提示时遇到错误消息Uncaught TypeError: qtip.$domEle.qtip is not a function。

我的代码如下所示：

function graphDirective() {
  return {
    restrict: 'E',
    templateUrl: 'app/graph/graph.html',
    link() {
      const cytoscape = require('cytoscape');
      const jquery = require('jquery');
      const cyqtip = require('cytoscape-qtip');
      cyqtip(cytoscape, jquery);

      const cy = cytoscape({
        container: document.querySelector('graph #cy')
      });

      cy.add({
        nodes: [
          {
            data: {
              id: 'test'
            }
          }
        ]
      });

      cy.$('#test').qtip({
        content: 'Hello!'
        style: {
          classes: 'qtip-bootstrap'
      });
    }
  };
}

export default graphDirective;

我已经完成了this quite similar thread，但由于在cytoscape.js-qtip之前需要通过CommonJS进行jQuery，因此这个解决方案不太合适。

有谁知道如何解决这个问题？提前谢谢。

编辑：修复了代码示例中的输入错误。

Answer 1

我怀疑你的选择器有问题：

cy.$('test')

这应该是：

cy.$('#test')

...如果您正在通过它的ID查找节点。或者：

cy.$('.test')

...如果您正在按类查找节点。

有关选择器的更多信息：http://js.cytoscape.org/#selectors

Answer 2

在我的情况下，yarn同时安装了两个jQuery版本：2.x和3.x。

如果遇到同一问题，解决方案很简单-只需将此属性添加到您的package.json。

"resolutions": { 
  "jquery": "2.2.4" //or whatever version that satisfies all requirements
}

cytoscape.js-qtip扩展名：qtip。$ domEle.qitp不是函数

2 个答案: