CODEWITHSUNDEEP
javascriptreactjs
Sajgoniarz
Sajgoniarz

Reputation: 179

React.js Update component passed as argument

I'm developing web xmpp chat using React.js and Strophe.js, and I run in quite problem.

XMPP connection is stored single object, but what is tricky, connection status change is handled by class, where i can store the true handler (because displaying connection status will have 2 different views, and Strophe.OnConnection handler cannot be changed after initialization)

What I want to achieve is to pass component to a function, to render itself with new props, something like it 

var statusHandler = {
    handler:"",
    setStatus: function(status) {
        React.render(<this.handler value=status/>, dom);
    }
}

var firstContainer = React.render(<anotherComponent/>, dom);
statusHandler.handler = firstContainer;
XMPPConnection(login,pwd,statusHandler.setStatus);

//now changing component
var secondContainer = React.render(<anotherComponent/>, dom);
statusHandler.handler = secondContainer;

Or its possible to define callback on component,and pass it as argument (but not a static function)

Upvotes: 0

Views: 273

Answers (1)

Robert
Robert

Reputation: 677

One idea that may clean up your code would be to emit an event when the connection status changes. Then inside your react components inside componentDidMount listen to that event and set your state accordingly.

Something like this: http://jsfiddle.net/kb3gN/11114/

Upvotes: 1

Related Questions