React-native不显示故事书元素

Question

我打开新的react-native v0.49项目并使用命令

安装故事书

  

npm i -g @ storybook / cli

然后我打开我的项目并运行

  

getstorybook

我在项目中看到故事书模块

    {
  "name": "materialApp",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest",
    "storybook": "storybook start -p 7007"
  },
  "dependencies": {
    "react": "16.0.0-beta.5",
    "react-native": "0.49.3"
  },
  "devDependencies": {
    "babel-jest": "21.2.0",
    "babel-preset-react-native": "4.0.0",
    "jest": "21.2.1",
    "react-test-renderer": "16.0.0-beta.5",
    "@storybook/react-native": "^3.2.13",
    "@storybook/addon-actions": "^3.2.13",
    "@storybook/addon-links": "^3.2.13",
    "react-dom": "16.0.0-beta.5",
    "prop-types": "^15.6.0"
  },
  "jest": {
    "preset": "react-native"
  }
}

当我运行npm运行故事书时，我看到了

然后我通过

将服务器连接到react-native app

  

adb reverse tcp：7007 tcp：7007

我通过

运行react-native app

  

react-native run-android

但我在服务器中看不到任何元素

Answer 1

您需要自己添加故事，它不会自动生成。

这是故事书项目本身的示例，

https://github.com/storybooks/storybook/blob/master/examples/react-native-vanilla/storybook/stories/index.js

storiesOf('Button', module)
  .addDecorator(getStory => <CenterView>{getStory()}</CenterView>)
  .add('with text', () => (
    <Button onPress={action('clicked-text')}>
      <Text>Hello Button</Text>
    </Button>
  ))
  .add('with some emoji', () => (
    <Button onPress={action('clicked-emoji')}>
      <Text>   </Text>
    </Button>
  ));

storiesOf('Knobs', module)
  .addDecorator(withKnobs)
  .add('with knobs', knobsWrapper);