{"action":"opened","issue":{"url":"https://api.github.com/repos/drcmda/react-spring/issues/371","repository_url":"https://api.github.com/repos/drcmda/react-spring","labels_url":"https://api.github.com/repos/drcmda/react-spring/issues/371/labels{/name}","comments_url":"https://api.github.com/repos/drcmda/react-spring/issues/371/comments","events_url":"https://api.github.com/repos/drcmda/react-spring/issues/371/events","html_url":"https://github.com/drcmda/react-spring/issues/371","id":390359319,"node_id":"MDU6SXNzdWUzOTAzNTkzMTk=","number":371,"title":"Include detailed comments on few of the new React Hook examples","user":{"login":"desmap","id":43666255,"node_id":"MDQ6VXNlcjQzNjY2MjU1","avatar_url":"https://avatars2.githubusercontent.com/u/43666255?v=4","gravatar_id":"","url":"https://api.github.com/users/desmap","html_url":"https://github.com/desmap","followers_url":"https://api.github.com/users/desmap/followers","following_url":"https://api.github.com/users/desmap/following{/other_user}","gists_url":"https://api.github.com/users/desmap/gists{/gist_id}","starred_url":"https://api.github.com/users/desmap/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/desmap/subscriptions","organizations_url":"https://api.github.com/users/desmap/orgs","repos_url":"https://api.github.com/users/desmap/repos","events_url":"https://api.github.com/users/desmap/events{/privacy}","received_events_url":"https://api.github.com/users/desmap/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2018-12-12T18:47:43Z","updated_at":"2018-12-12T18:47:43Z","closed_at":null,"author_association":"NONE","body":"It's nice to see that react-spring already implemented React Hooks and further provides tons of examples! This is great and I highly appreciate your work. \r\n\r\nBut I still can't get a good understanding of how react-spring actually works. I am trying to implement a gallery with React Hooks where five pictures cross-fade infinitely. I took one of the new examples (the simple-transition one), adjusted it a bit and got something working but not really well. And tbh, I don't have a clue what is going on.\r\n\r\nThe code: https://codesandbox.io/s/0yv00j8j40\r\n\r\nSome questions (and they show that I have not the slightest grasp):\r\n\r\n1. What's the difference between Spring and Transition? Can I also use Springs for my use case?\r\n2. The Transition doc says 'it takes a list of items of any type, and their keys', does 'list' implies an array? What is meant by 'keys'? The indexes of array items? What if I have just one item and no array?\r\n3. However, what are 'keys', for what does your Transition component needs them and why should my app care? What is meant by 'The latter defaults to item => item' in the Transition documentation?\r\n4. Could you elaborate on 'The full signature looks like (item, state, index) => props => ReactNode' with some examples? Where do you pass those args? In the examples I saw that you pass 'item', state as individual objects ('from'. 'enter', 'leave') and no index as key but as value from items; so it's not like in the documentation\r\n5. Does react-spring works together with CSS-in-JS generated CSS from modules like emotion?\r\n\r\nMaybe it's already a huge step for us if you could just include extensive comments in one or two examples and maybe write a post on the fundamentals of react-spring as a bonus. It looks like an awesome lib and I need to fully understand its foundation in order to use it properly and not just copy and pasting snippets.\r\n\r\n"}}
{"actor":{"display_login":"desmap"}}