What else can be actions can be used for except displaying the userEvent? Is this one is just use to replace the log or alert in the usecase story and show same value in action instead of the log or alert or there is also other use of this actions? Is it possible to get more than just the console. What I mean by this is is let's say that when I clicked in the button, then the new component get rendered. Is there a way to show something more useful in the action tab in such situation except just: onClick: () => action('Button Clicked')(),
@RicardoQBazan Жыл бұрын
Hey, great video! thanks for sharing. I have a little problem here: what about nested props? My component is like: interface HeaderProps { title: string // etc whateverProps: { onClick: () => void } } I tried: argTypes: { whateverProps: { onClick: { action: 'whatever clicked' }, }, }, but it doesn't work 😥
@chromaticui Жыл бұрын
Thanks Ricardo! Unfortunately, controls does not yet support nested objects (other than JS objects). So you won't get the same experience for event handlers that are nested. Would you be open to sharing what the component interface looks like? I'd be interested to see the practical use case. Thanks! Chan
@alexmachin1785 Жыл бұрын
Hey, Great video as usual 😉 I've always struggled to get actions working especially with custom events Are there any full examples of getting actions working with custom events like the onLogin event ?
@chromaticui Жыл бұрын
Thanks! I totally get the confusion. I really didn't understand actions before researching this video. Check out storybook.new and spin up a new sandbox (with your preferred framework). There you'll see the examples that we cover in the video. But, by default, they use a configuration option that will be deprecated in the next major version of Storybook. So, it might be worth spinning that up and then running thru this tutorial in that cloud environment. Chan
@igorbeaver46928 ай бұрын
Great! But still don't get why writing action is better than just write console log