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;