« home
Steun ons

Werken met markdown

The views can render markdown files. This is very handy: you don’t need to write a lot of html-code. To make markdown integrated with the views, this framework makes it possible to pass through markdown-code by a property of this.props. Because markdown is html-code, you will need dangerouslySetInnerHTML to render it as html.

Step 1: load markdown inside the modelfile requiring ‘itsa-react-fs-markdown’

Example of /models/index.js):

const markdown = require('itsa-react-server/lib/markdown'),

const model = async (request, reply, modelConfig, language /* , manifest */) => {
    const pagecontent = await markdown.readFile('../markdowns/'+language+'/index.md'), // asynchronous
    // pagecontent will have a form like: {__html: ''}

    return {
        pagecontent
    };
};

module.exports = model;

Step 2: Use this.props while rendering the view

Example of /views/index.jsx):

const React = require('react');

class Index extends React.Component {
    render() {
        return <div dangerouslySetInnerHTML={this.props.pagecontent} />;
    }
}

module.exports = Index;
OFFLINE