ручки сборника рассказов, допускающие одноименный текст - PullRequest
Новая
       6

ручки сборника рассказов, допускающие одноименный текст

0 голосов
/ 15 декабря 2018

У меня есть несколько файлов сборника рассказов, которые находятся в одной папке, и когда я даю двум разным файлам динамический заголовок, он переопределяется последним загруженным.Похоже, его текстовое имя задается как глобальное, но я не могу понять, почему сборник рассказов сделает это, или я что-то упустил.

Простой пример ниже двух компонентов.Когда я нажимаю один на другой в папке компонентов, заголовок обоих компонентов получает одинаковый текст.

Story1.js 

import React from 'react';
import { storiesOf } from '@storybook/react';
import { withInfo } from '@storybook/addon-info';
import { withKnobs, select, text } from '@storybook/addon-knobs/react';
import Component1 from '.';
import { withNotes } from '@storybook/addon-notes';


const story = storiesOf('components/', module)
  .addDecorator(withKnobs)

story.add(
  'Component1',
  withInfo(info)(() => {

    const title = text('Title', 'A Title');

    const props = {
      title: {
        text: `<h3>${title}</h3>`,
      },
    };

    return (
      <Component1 { ...props }/>
    );
  },
  ),
);

Story2.js 

import React from 'react';
import { storiesOf } from '@storybook/react';
import { withInfo } from '@storybook/addon-info';
import { withKnobs, select, text } from '@storybook/addon-knobs/react';
import Component2 from '.';
import { withNotes } from '@storybook/addon-notes';


const story = storiesOf('components/', module)
  .addDecorator(withKnobs)

story.add(
  'Component2',
  withInfo(info)(() => {

    const title = text('Title', 'Another Title');

    const props = {
      title: {
        text: `<h3>${title}</h3>`,
      },
    };

    return (
      <Component2 { ...props }/>
    );
  },
  ),
);

ПРИМЕЧАНИЕ:

Если я изменю текстовое имя component2 на что-то вроде 'header' вместо Title, тогда оно будет работать правильно, и название регулятора не будет переопределено.

const title = text('header', 'Another Title');

const props = {
  title: {
    text: `<h3>${header}</h3>`,
  },
};

Может кто-нибудь объяснить, почему это происходит.У меня есть много историй, и у большинства из них есть кнопка заголовка.Я действительно не хочу называть их title1 title2 и так далее ...

...