Skip to content

Commit f3f524e

Browse files
committed
docs(readme): update code sample
1 parent 1d4e760 commit f3f524e

File tree

1 file changed

+22
-21
lines changed

1 file changed

+22
-21
lines changed

README.md

Lines changed: 22 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -122,8 +122,27 @@ The following [example](https://repl.it/@remarkablemark/html-react-parser-replac
122122
```jsx
123123
import React from 'react';
124124
import { renderToStaticMarkup } from 'react-dom/server';
125-
import parse from 'html-react-parser';
126-
import domToReact from 'html-react-parser/lib/dom-to-react';
125+
import parse, {domToReact} from 'html-react-parser';
126+
127+
const parserOptions = {
128+
replace: ({ attribs, children }) => {
129+
if (!attribs) return;
130+
131+
if (attribs.id === 'main') {
132+
return (
133+
<h1 style={{ fontSize: 42 }}>
134+
{domToReact(children, parserOptions)}
135+
</h1>
136+
);
137+
} else if (attribs.class === 'prettify') {
138+
return (
139+
<span style={{ color: 'hotpink' }}>
140+
{domToReact(children, parserOptions)}
141+
</span>
142+
);
143+
}
144+
}
145+
};
127146

128147
const elements = parse(
129148
`
@@ -133,25 +152,7 @@ const elements = parse(
133152
</span>
134153
</p>
135154
`,
136-
{
137-
replace: ({ attribs, children }) => {
138-
if (!attribs) return;
139-
140-
if (attribs.id === 'main') {
141-
return (
142-
<h1 style={{ fontSize: 42 }}>
143-
{domToReact(children, parserOptions)}
144-
</h1>
145-
);
146-
} else if (attribs.class === 'prettify') {
147-
return (
148-
<span style={{ color: 'hotpink' }}>
149-
{domToReact(children, parserOptions)}
150-
</span>
151-
);
152-
}
153-
}
154-
}
155+
parserOptions
155156
);
156157

157158
console.log(renderToStaticMarkup(elements));

0 commit comments

Comments
 (0)