javascriptreactjsreact-spring

React-Spring confusion: const dir = xDir < 0 ? -1 : 1

On the react-spring website, their is a card-flicking application to show one of their many functionalities.

Here is the code-sand-box demo of it: https://codesandbox.io/embed/j0y0vpz59

As seen on line 28, the card can be flicked in the left or right position, and that data is stored in dir, with left being -1 and right being 1 (as I understand from the code).

line 28:

    const dir = xDir < 0 ? -1 : 1 // Direction should either point left or right

I am still unfamiliar with this line code and it might be the root problem for a bug I'm having, I was wondering what the '0' means along with the '<' and '?'.

Thanks in advance

Solution

  • Its a shorthand if.

    Corresponding fullsize if:

    if(xDir < 0) {
  dir = -1
} else {
  dir = 1
}