Storybook 的 addon-actions 为啥收不到事件？

茂庭提问于 2026-03-05 20:27:18 阅读 3

工具

我在 Storybook 里用 addon-actions 想监听按钮点击，但点了没反应，控制台也没输出。是不是我哪里写错了？

我已经在 .storybook/preview.js 里引入了 addons，也装了 @storybook/addon-actions，但就是不触发。

import { action } from '@storybook/addon-actions';

export const Primary = () => (
  <button onClick={action('button-clicked')}>
    Click me
  </button>
);

Addons插件

我来解答赞 1 收藏

反馈

1 条解答

a'ゞ子璇 Lv1

你这写法有问题，action不能直接放在onClick里调用，这样会在渲染时就执行了函数而不是在点击时触发。优化一下写法：

export const Primary = () => (

  

);

或者更简洁的写法：

export const Primary = () => (

  

);

区别在于第一种写法是手动包裹了箭头函数，第二种是直接传action函数。两种都可以，看个人喜好。

顺便吐槽下，这坑我当年也踩过，大半夜调试了半天才发现是函数调用时机的问题...

2026-03-05 21:03