MrBlenny / react-flow-chart

🌊 A flexible, stateless, declarative flow chart library for react.
https://mrblenny.github.io/react-flow-chart/index.html
MIT License
1.46k stars 306 forks source link

onLinkMouseEnter and onLinkMouseLeave an error accurse #206

Closed falcon027 closed 3 years ago

falcon027 commented 3 years ago

It is a very strange problem witch course if I hover over a Link. image

As I looked at the onLinkMouseEnter, onLinkMouseLeave event and logging the variables all variables are looking good except for the var linkwhich becomes undefined?

actions.js

exports.onLinkMouseEnter = function (_a) {
    var linkId = _a.linkId;
    return function (chart) {
        // Set the link to hover
        var link = chart.links[linkId];
        // Set the connected ports to hover
        console.log(chart,linkId,link)  // πŸ‘ˆ 

        if (link.to.nodeId && link.to.portId) { // ❗  error throw because of the undefined variable? 

My console log reviled:

I made a workaround by checking the variable link if it is undefined, but I am still interested that the problem is.

actions.js

exports.onLinkMouseEnter = function (_a) {
    var linkId = _a.linkId;
    return function (chart) {
        // Set the link to hover
        var link = chart.links[linkId];
        // Set the connected ports to hover
++        if(link !== undefined) {
            if (link.to.nodeId && link.to.portId) {
                if (chart.hovered.type !== 'link' || chart.hovered.id !== linkId) {
                    chart.hovered = {
                        type: 'link',
                        id: linkId,
                    };
                }
            }
++        }

        return chart;
    };
};
exports.onLinkMouseLeave = function (_a) {
    var linkId = _a.linkId;
    return function (chart) {
        var link = chart.links[linkId];
        // Set the connected ports to hover
++        if(link !== undefined) {

              if (link.to.nodeId && link.to.portId) {
                   chart.hovered = {};
              }
++        }
        return chart;
    };
};