Question

我正在尝试让我的Storybook与React应用一起工作。我正在使用Redux 4.0.1。

我不能在使用Redux的地方使用特定组件。这是我得到的错误：

故事书错误，无法读取未定义的属性“位置”

这是我的devDependencies：

  "devDependencies": {
    "@babel/core": "^7.10.0",
    "@storybook/addon-actions": "^5.3.19",
    "@storybook/addon-links": "^5.3.19",
    "@storybook/addons": "^5.3.19",
    "@storybook/react": "^5.3.19"
  }

我的组件Navbar.js：

import React, { Component } from "react";
import { connect } from "react-redux";

class Navbar extends Component {
  render() {
    const { user } = this.props.auth;
    return (
      <div className="navbar-fixed">
        <nav className="z-depth-0">Hello, {user.name} </nav>
      </div>
    );
  }
}
const mapStateToProps = state => ({
  auth: state.auth
});
export default connect(
  mapStateToProps
)(Navbar);

还有我的故事2-Navbar.stories.js：

import React from 'react';
import Provider from '../src/Provider.js'
import configureStore from "../src/configureStore";
import Navbar from '../src/components/layout/Navbar';

export default {
  title: 'Navbar',
  decorators: [storyFn => <Provider store={ configureStore }>{storyFn()}</Provider>]
};

export const Yay = () => <Navbar />;

我想使用“模拟”数据传递给我的导航栏（如名称和头像网址），否则会出现redux错误。

感谢任何帮助。

Answer 1

升级 StoryBook 后我遇到了同样的问题。我发现的解决方法是删除 node_modules 文件夹、.storyBook 文件夹、删除 package-lock.json，并删除 package.json 中对 StoryBook 的任何引用。之后运行“npx sb init”和“npm install”。然后“npm run storybook”问题就解决了！

故事书错误无法读取未定义的属性“位置”

1 个答案: