Add a component to render a markdown file from url
This commit is contained in:
parent
2ed4d61c55
commit
e4a301536d
1 changed files with 47 additions and 0 deletions
47
src/components/Screens/MarkdownRenderScreen.js
Normal file
47
src/components/Screens/MarkdownRenderScreen.js
Normal file
|
@ -0,0 +1,47 @@
|
||||||
|
import React from 'react';
|
||||||
|
import Markdown from "react-native-markdown-display";
|
||||||
|
import {withTheme} from "react-native-paper";
|
||||||
|
/**
|
||||||
|
* Read a text file and output the content
|
||||||
|
*
|
||||||
|
* Example Usage:
|
||||||
|
* var myTxt = require("./myTxt.txt");
|
||||||
|
* ...
|
||||||
|
* <TextFileReader
|
||||||
|
txt={myTxt}
|
||||||
|
/>
|
||||||
|
*/
|
||||||
|
class TextFileReader extends React.Component {
|
||||||
|
constructor(props) {
|
||||||
|
super(props);
|
||||||
|
this.state = {
|
||||||
|
text: ""
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
componentDidMount() {
|
||||||
|
this.readTextFile(this.props.text);
|
||||||
|
}
|
||||||
|
|
||||||
|
readTextFile = file => {
|
||||||
|
let xhr = new XMLHttpRequest();
|
||||||
|
xhr.open("GET", file, true);
|
||||||
|
xhr.onreadystatechange = () => {
|
||||||
|
if(xhr.readyState === 4 && xhr.status === 200){
|
||||||
|
const allText = xhr.responseText;
|
||||||
|
this.setState({
|
||||||
|
text: allText
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
xhr.send(null);
|
||||||
|
};
|
||||||
|
|
||||||
|
render(){
|
||||||
|
return (
|
||||||
|
<Markdown>{this.state.text}</Markdown>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export default withTheme(TextFileReader);
|
Loading…
Reference in a new issue