Я написал компонент React под названием MyComponent, и мне нужно написать файл .md для генерации документа, описывающего его использование.
Структура компонента внутри файла .jsx выглядит следующим образом:
export default class MyComponent extends React.Component {
render() {
return (
<div> <img id="image-to-style" /> </div>
);
}
}
Компонент автоматически присваивает элементу img стиль margin-top: 40px благодаря .less-файлу, загруженному в файл ввода (не показан).Однако этот стиль не отображается в сгенерированном документе (я знаю, потому что поле отключено), поэтому мне нужно применить его вручную в файле .md.
Код в файле .md выглядит следующим образом:
```jsx
const myImageStyle = {
marginTop: '40px'
};
<MyComponent
style={myImageStyle}
/>
```
Я пытаюсь передать myImageStyle элементу img внутри моего компонента.
Для простоты я не добавил никаких свойств в свой минимум.рабочий компонент здесь.
Я думал о добавлении нового свойства стиля к фактическому файлу компонента .jsx, чтобы он отображался в сгенерированном документе точно так же, как в противном случае, но мне это кажется хакерским.
Мой вопрос: каков наилучший способ применения стиля к элементу img внутри моего компонента в сгенерированном файле документации .md?