如何避免 Storybook 模板中的 JS USELESS_ARROW_FUNC_BIND 错误

Question

这是 Storybook 6.0 中故事的sample code：

const Template = (args) => <Button {...args} />;

// Each story then reuses that template
export const Primary = Template.bind({});

但是，Template.bind 未能通过 DeepScan 静态分析中的 USELESS_ARROW_FUNC_BIND 测试：

有没有办法避免这个 linter 问题？我试过 Template({}) 但编译器失败了，表明缺少 context 参数。

Answer 1

const Template = (args) => <Button {...args} />; 行显示 Template 没有使用 this。

但是，在WithMarker函数的执行过程中，有一个Template.bind({})将this赋值给{}。

由于未使用 this，您可以将 export const WithMarker = Template.bind({}) 替换为 export const WithMarker = Template。

How to avoid JS USELESS_ARROW_FUNC_BIND error in Storybook Template