Trigger function just once after Collision

[Franckapik]

Here is my code:

export default function Joueur(props) {
  const { x, y, currentId, players, playersList, set, reset } = useStore()

  const addScore = () => {
    set(state => {state.playersList[currentId].score += 1} )
  }

  const [ref, api] = useBox(() => ({
    type : "Dynamic",
    mass :1,
    args:[0.1,0.1,0.1],
    ...props,
    onCollide: (e) => { reset(); addScore() }
  }))
  useFrame(()=> api.position.set(y,0.10,x));

  return (
    <mesh ref={ref} >
        <boxBufferGeometry attach="geometry" args={[0.2,0.2,0.2]}  />
        <meshLambertMaterial attach="material" color={props.color} />
    </mesh>
  )
}

I would like to find a way to trigger the function addScore juste once onCollide.
For now, it get the function 4 times... :/

[codynova]

const { currentId, set } = useStore()
const hasCollided = useRef(false)
const addScore = () => {
    hasCollided.current = true
    set(state => state.playersList[currentId].score += 1)
}
const [ref] = useBox(() => ({
    mass: 1,
    args: [ 0.1, 0.1, 0.1 ],
    onCollide: e => !hasCollided.current && addScore(),
}))

Will that do the trick for you?

[Franckapik]

Thank you really much @codynova , it seems to work now !
I have to learn about this way to use condition with the && operand...
Thank you again !

[codynova]

@Franckapik No problem, I'm happy to help. Regarding the && operand, these statements are identical:

// do something if condition is true
if (valueIsTrue) doSomething()

// do something if condition is true
valueIsTrue && doSomething()

[Franckapik]

it couldn't be better explained! 👍