custom shader and time uniform

[bolti95]

Hi, I have created a simple shader and I want to change the colour over time. I've passed through a uniform u_time from my shaderMaterial, but I can't get the u_time variable to update the shader unless I refresh the page, it changes colour. Does this have something to do with React's state lifecycle or the way I am passing the variable through to the shader?

https://codesandbox.io/s/mystifying-diffie-wlcs3?file=/src/App.js:527-528

You'll have to excuse me if the answer is obvious I'm still quite new to all this

[drcmda]

i think you cant update shaders in threejs like that. once you've set a shader its done. all you need to do is put a ref on it and set the time in useEffect, useLayoutEffect or useFrame. you most likely mean to use useFrame because that would update it every frame.

here's an example: https://codesandbox.io/s/shader-fire-3878x?file=/src/shaders/Fire.js:3244-3315

[bolti95]

thanks for the example, I've tried to adapt my code using the class constructor.. I keep getting this error, Cannot read property 'getState' of null https://codesandbox.io/s/mystifying-diffie-wlcs3?file=/src/App.js