Preview.js 923 B

1234567891011121314151617181920212223242526272829303132333435363738394041424344
  1. import React from 'react';
  2. import PropTypes from 'prop-types';
  3. export default class Preview extends React.Component {
  4. constructor(props) {
  5. super(props);
  6. }
  7. componentDidUpdate() {
  8. if (this.props.isMathJaxEnabled) {
  9. this.renderMathJax();
  10. }
  11. }
  12. renderMathJax() {
  13. const MathJax = window.MathJax;
  14. if (MathJax != null) {
  15. MathJax.Hub.Queue(["Typeset", MathJax.Hub, this.element]);
  16. }
  17. }
  18. generateInnerHtml(html) {
  19. return {__html: html};
  20. }
  21. render() {
  22. return (
  23. <div
  24. ref={(elm) => {
  25. this.element = elm;
  26. this.props.inputRef(elm);
  27. }}
  28. className="wiki page-editor-preview-body" dangerouslySetInnerHTML={this.generateInnerHtml(this.props.html)}>
  29. </div>
  30. )
  31. }
  32. }
  33. Preview.propTypes = {
  34. html: PropTypes.string,
  35. inputRef: PropTypes.func.isRequired, // for getting div element
  36. isMathJaxEnabled: PropTypes.bool,
  37. };