Skip to content

Commit

Permalink
docs(ref): add readme section
Browse files Browse the repository at this point in the history
  • Loading branch information
cyntler committed Mar 25, 2023
1 parent affedb2 commit f4c3fbe
Showing 1 changed file with 31 additions and 1 deletion.
32 changes: 31 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -119,7 +119,7 @@ const DocViewerControlOverDisplayedDocument = () => {

### Displaying blob/uploaded documents

Since **1.6.2** you can use documents in the form of blobs, which allows you to e.g. display uploaded files.
Since **v1.6.2** you can use documents in the form of blobs, which allows you to e.g. display uploaded files.

```jsx
const DocViewerWithInputApp = () => {
Expand Down Expand Up @@ -326,6 +326,36 @@ const MyDocViewer = styled(DocViewer)`
`;
```
## Using DocViewerRef
Since **v1.13.0** you can control the display of the document with `reference`.
```tsx
import DocViewer, { DocViewerRef } from "@cyntler/react-doc-viewer";

export const UsingRef = () => {
const docViewerRef = useRef<DocViewerRef>(null);

return (
<>
<div>
<button onClick={() => docViewerRef?.current?.prev()}>
Prev Document By Ref
</button>
<button onClick={() => docViewerRef?.current?.next()}>
Next Document By Ref
</button>
</div>
<DocViewer
ref={docViewerRef}
documents={docs}
config={{ header: { disableHeader: true } }}
/>
</>
);
};
```
## Config
You can provide a config object, which configures parts of the component as required.
Expand Down

0 comments on commit f4c3fbe

Please sign in to comment.