how can i use fluidRenderer?

[WachsenHaus]

I am studying react-babylonjs. I want to use the fluid that exists in the official documentation of babylonjs, but is it not supported by react-babylonjs? Any help would be greatly appreciated.

[brianzinn]

The easiest way right now would be to make a component and put it inside <Scene>...</Scene>.

Something like (untested):

import { useScene } from 'react-babylonjs';

export type FluidRenderType = {
 enabled: boolean
}

export const FluidRenderer: FC<FluidRendererType> = ({enabled}) => {
  const scene = useScene();
  useEffect(() => {
    if (enabled) {
      const fluidRenderer = scene.enableFluidRenderer();
      // do something with your fluid renderer.
      // const renderObject = fluidRenderer.addParticleSystem(particleSystem);
    } else {
      scene.disableFluidRenderer();
    }
  }, [enabled]);
 return null;  
}

You use like this:

  const [enabled, setEnabled] = useState(true);
  ...
  <Scene ...>
     <FluidRenderer enabled={enabled}
  </Scene>

You can also use the callbacks when the scene is created, but this will let you use your own component.

[brianzinn]

I did write a bunch of stuff for Physics to have a declarative counterpart. I would consider implementing something declarative into react-babylonjs if you had a use case. There has been some thought about making an extensions library with useful components. Sorry for the delayed reply.