react-native渲染html字符串

寇坚成
2023-12-01

之前查到react-native-htmlview,可以正常显示没有图像的文本,但是不能自适应显示图片

最后找到解决方法,用webView

render() {
       const BaseScript = `
        (function () {
            var height = null;
            function changeHeight() {
              if (document.body.scrollHeight != height) {
                height = document.body.scrollHeight;
                if (window.postMessage) {
                  window.postMessage(JSON.stringify({
                    type: 'setHeight',
                    height: height,
                  }))
                }
              }
            }
            setTimeout(changeHeight, 300);
        } ())
        `;
      return(
            <WebView
                  source={{html:content,baseUrl:''}}//必须加baseUrl 否则在低版本的android系统会报错
                  injectedJavaScript={BaseScript}//设置高度 被内容撑开
                  automaticallyAdjustContentInsets={false}
                  style={{height: this.state.htmlHeight}}
                  javaScriptEnabled={true}
                  domStorageEnabled={true}
                  decelerationRate="normal"
                  startInLoadingState={true}
                  scalesPageToFit={this.state.scalesPageToFit}
                  onMessage={this.onMessage.bind(this)}
              />
       )
}

 

 类似资料: