Sin descripción

app.js 1.2KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859
  1. import React, { Component } from 'react';
  2. import {
  3. StyleSheet,
  4. Text,
  5. View
  6. } from 'react-native';
  7. import {RichTextEditor, RichTextToolbar} from 'react-native-ZSSRichTextEditor'
  8. import KeyboardSpacer from 'react-native-keyboard-spacer';
  9. export default class RichTextExample extends Component {
  10. constructor(props) {
  11. super(props);
  12. this.getHTML = this.getHTML.bind(this);
  13. }
  14. render() {
  15. return (
  16. <View style={styles.container}>
  17. <RichTextEditor
  18. ref={(r)=>this.richtext = r}
  19. style={styles.richText}
  20. initialHTML={'Hello <b>World</b> <p>this is a new paragraph</p> <p>this is another new paragraph</p>'}
  21. />
  22. <RichTextToolbar
  23. getEditor={() => this.richtext}
  24. />
  25. <KeyboardSpacer/>
  26. </View>
  27. );
  28. }
  29. async getHTML() {
  30. const html = await this.richtext.getHtml();
  31. }
  32. componentDidMount() {
  33. setTimeout(()=>{
  34. this.getHTML();
  35. }, 3000);
  36. }
  37. }
  38. const styles = StyleSheet.create({
  39. container: {
  40. flex: 1,
  41. flexDirection: 'column',
  42. backgroundColor: '#F5FCFF',
  43. paddingTop: 40
  44. },
  45. richText: {
  46. alignItems:'center',
  47. justifyContent: 'center',
  48. backgroundColor: 'transparent',
  49. },
  50. });