Pixi react with React

[sayasajer]

Hi,

 

I try to search everywhere and  I only found one example which is in ReactPIXI.

 

My question is how I can make React communicate/emit data to PixiJs ? For example, React emit data and it listened by Pixi.

 

Is there any good example out there?

 

Thank you.

[mattstyles]

I'm not sure I'm following at all. React is a rendering library that implements a top-down functional architecture to help you build a rendering layer for your applications, Pixi does the same in that it helps you structure your rendering layer, but using canvas.

 

An event emitter can be implemented any way you like, both Pixi and React are agnostic to your implementation.

 

If you'd like to get properties from React components into Pixi, then just pass them through to whatever objects/classes/functions you are using to control Pixi. One thing to consider with React is that any DOM you create using JSX wont exist in the DOM until that component has mounted; usually this means that you let your component render, and then in the `ComponentDidMount` callback implement any code that needs that freshly created DOM (Pixi needs a DOM, specifically, a canvas).

 

There are a number of ways to trigger a screen refresh with React, are you after a way of telling Pixi to redraw whenever the React component mounting the canvas updates?

[sayasajer]

There are a number of ways to trigger a screen refresh with React, are you after a way of telling Pixi to redraw whenever the React component mounting the canvas updates?

 

Yes, I am. For example there is a 'change background color' button which is in React Dom. When I click that button, the Pixi canvas color background will change according to that particular color.

[xerver]

Can't you just call `renderer.render()` in the update/render method?