ReactJS firing events with YUI

493 views Asked by At

This is a long shot, but i need your help.

We are refactoring some modules from YUI to ReactJS and to make some of them works, we still needs to keep some support of the YUI until we migrate all the components to ReactJS.

One problem that I came across, was trying to send an Event to a module in YUI.

So far, my idea, and please, correct me if i'm on a wrong path here because i'm pretty new, is to create a mixin for YUI so I can grab the "Y" object and fire an event later on.

So In the beginning of my component I have:

var MyComponent = React.createClass({

    mixins: [YahooYUI],

    getDefaultProps: function() {
        return {
            YUIModules: [
                'widget', 'my_yui_module'
            ]
        };
    },

    render: function() {
        if (this.Y && this.Y.Global) {
            this.Y.Global.fire('myevent');
        }
    }
});

Inside my YUI module, I'm listening for

Y.Global.on('myevent', function() { })

My YahooYUI mixin looks like this:

var YahooYUI = {

    componentWillMount: function() {

        var YUIModules = this.props.YUIModules;

        if (!YUIModules) {
            YUIModules = ['yui-base', 'node', 'node-base'];
        }

        if (YUI && typeof YUI != "undefined") {
            this.Y = YUI({}).use(this.props.YUIModules);
        }
    }
};

I thought i was on the right track, but my problem is that when i get to the render function, or componentWillMount, or componentDidMount of my main component, none of them has this.Y.Global ready to fire the event.

Like i said, I know this is a long shot, but i thought i might ask you guys, perhaps someone would have a better understanding of how this works to help me out!

Thanks

0

There are 0 answers