Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://github.com/conorhastings/react-syntax-highlighter-virtualized-renderer below:

conorhastings/react-syntax-highlighter-virtualized-renderer: a way to use react-virtualized to render lines of code for react-syntax-highlighter

React Syntax Highlighter allows for the use of custom renderers to change the behavior of the way the syntax highlighted code is rendered. This module utilizes React Virtualized to virtualize rendering of non visible code nodes to allow for better performance when syntax highlighting large blocks. See an example: here

npm install react-syntax-highlighter --save
npm install react-syntax-highlighter-virtualized-renderer --save

import SyntaxHighlighter from 'react-syntax-highlighter';
import virtualizedRenderer from 'react-syntax-highlighter-virtualized-renderer'; 
import { docco } from 'react-syntax-highlighter/styles/hljs';
const Component = () => {
  const codeString = '(num) => num + 1';
  return (
	<SyntaxHighlighter 
	  language='javascript' 
	  style={docco}
	  renderer={virtualizedRenderer()}
  	>
  		{codeString}
  	</SyntaxHighlighter> 
  );
}

• overscanRowCount - number of rows to render ahead of what is currently visible. (defaults to 10)
• rowHeight - if you use different fonts / line height styles, you made need to adjust the row height (defaults to 15)

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4