Skip to content

Examples

Mient-jan Stelling edited this page Sep 15, 2017 · 17 revisions

These examples are for v2.*

Default Implementation:

import react from 'react';
import {PureComponent} from 'react-native';
import Markdown from 'react-native-markdown-renderer';

const copy = `# h1 Heading 8-)

| Option | Description |
| ------ | ----------- |
| data   | path to data files to supply the data that will be passed into templates. |
| engine | engine to be used for processing templates. Handlebars is the default. |
| ext    | extension to be used for dest files. |
`;

export default class Page extends PureComponent {

  static propTypes = {};
  static defaultProps = {};

  render() {
    return (
    	<Markdown>{copy}</Markdown>
    );
  }
}

Markdown with custom styling:

import react from 'react';
import {View, PureComponent, Text} from 'react-native';
import Markdown from 'react-native-markdown-renderer';
import { StyleSheet } from 'react-native';

const styles = StyleSheet.create({
  heading: {},
  heading1: {
    fontSize: 32,
    backgroundColor: '#000000',
    color: '#FFFFFF',
  },
  heading2: {
    fontSize: 24,
  },
  heading3: {
    fontSize: 18,
  },
  heading4: {
    fontSize: 16,
  },
  heading5: {
    fontSize: 13,
  },
  heading6: {
    fontSize: 11,
  }
});

const copy = `# h1 Heading 8-)

| Option | Description |
| ------ | ----------- |
| data   | path to data files to supply the data that will be passed into templates. |
| engine | engine to be used for processing templates. Handlebars is the default. |
| ext    | extension to be used for dest files. |
`;

export default class Page extends PureComponent {
  render() {
    return (
    	<Markdown style={styles}>{copy}</Markdown>
    );
  }
}
Clone this wiki locally