import React, { Component } from 'react'
|
import PropTypes from 'prop-types'
|
|
import './index.scss'
|
|
class BraftContent extends Component {
|
static propTpyes = {
|
value: PropTypes.any, // 内容
|
script: PropTypes.any // 自定义脚本
|
}
|
|
state = {
|
html: ''
|
}
|
|
UNSAFE_componentWillMount () {
|
const { value } = this.props
|
|
this.setState({html: value})
|
}
|
|
componentDidMount() {
|
this.loadScript()
|
}
|
|
UNSAFE_componentWillReceiveProps(nextProps) {
|
if (this.props.value !== nextProps.value) {
|
this.setState({html: nextProps.value}, () => {
|
this.loadScript()
|
})
|
}
|
}
|
|
loadScript = () => {
|
const { script } = this.props
|
const { html } = this.state
|
|
if (script && html) {
|
const that = this
|
let _html = ''
|
try {
|
// eslint-disable-next-line
|
let func = new Function('that', 'html', script)
|
_html = func(that, html)
|
} catch (e) {
|
_html = ''
|
console.warn(e)
|
}
|
|
if (_html) {
|
this.setState({html: _html})
|
}
|
}
|
}
|
|
render() {
|
const { html } = this.state
|
return (
|
<div className="braft-content" dangerouslySetInnerHTML={{ __html: html }}></div>
|
)
|
}
|
}
|
|
|
export default BraftContent
|
