Skip to content

Commit 6cd9a20

Browse files
docs(readme): fix instructions for Element type check in TS
1 parent 2f69295 commit 6cd9a20

File tree

1 file changed

+11
-10
lines changed

1 file changed

+11
-10
lines changed

README.md

+11-10
Original file line numberDiff line numberDiff line change
@@ -176,18 +176,19 @@ parse('<p id="replace">text</p>', {
176176
});
177177
```
178178

179-
For TypeScript projects, check that `domNode` is an instance of domhandler's `Element`:
179+
For TypeScript projects, you may need to check that `domNode` is an instance of domhandler's `Element`:
180180

181181
```tsx
182-
import parse, { Element } from 'html-react-parser';
182+
import { HTMLReactParserOptions } from 'html-react-parser';
183+
import { Element } from 'domhandler/lib/node';
183184

184-
parse('<p id="replace">text</p>', {
185+
const options: HTMLReactParserOptions = {
185186
replace: domNode => {
186-
if (domNode instanceof Element && domNode.attribs.id === 'replace') {
187-
return <span>replaced</span>;
187+
if (domNode instanceof Element && domNode.attribs) {
188+
// ...
188189
}
189190
}
190-
});
191+
};
191192
```
192193

193194
The following [example](https://repl.it/@remarkablemark/html-react-parser-replace-example) modifies the element along with its children:
@@ -367,12 +368,12 @@ parse('<p> </p>', { trim: true }); // React.createElement('p')
367368

368369
### v1.0.0
369370

370-
TypeScript projects will need to check the types in [v1.0.0](https://github.com/remarkablemark/html-react-parser/releases/tag/v1.0.0).
371+
TypeScript projects will need to update the types in [v1.0.0](https://github.com/remarkablemark/html-react-parser/releases/tag/v1.0.0).
371372

372-
For `replace` option:
373+
For the `replace` option, you may need to do the following:
373374

374375
```tsx
375-
import parse, { Element } from 'html-react-parser';
376+
import { Element } from 'domhandler/lib/node';
376377

377378
parse('<br class="remove">', {
378379
replace: domNode => {
@@ -446,7 +447,7 @@ See [#62](https://github.com/remarkablemark/html-react-parser/issues/62) and [ex
446447
447448
### TS Error: Property 'attribs' does not exist on type 'DOMNode'
448449
449-
The TypeScript error happens because `DOMNode` needs be an instance of domhandler's `Element`. See [migration](#migration) or [#199](https://github.com/remarkablemark/html-react-parser/issues/199).
450+
The TypeScript error occurs because `DOMNode` needs be an instance of domhandler's `Element`. See [migration](#migration) or [#199](https://github.com/remarkablemark/html-react-parser/issues/199).
450451
451452
## Performance
452453

0 commit comments

Comments
 (0)