javascript - 错误 : Youtube link inside html text inside react native app

标签 javascript html react-native webview html-rendering

我的一些 html 代码在我的应用程序中呈现时遇到了一些问题。

我正在获取它并将 html 代码保存在 this.state.text_ 中:

return fetch('https://www.rallyssimo.it/wp-json/wp/v2/posts/'+_links)
      .then(response => response.json())
      .then(responseJson => {
        this.setState(
          {
            text_: responseJson.content.rendered,
          },
          function() {}
        );
      })
      .catch(error => {
        console.error(error);
      });

如果我在 <Text> 中打印它选项卡它显示正确(显然是白色的 html 标签)。

但是当我尝试使用 react-native-html-render 库渲染它时,如果有一个 youtube 视频的标签,我得到一个错误:invariant violation: WebView has been removed from react native... etc..." .

<HTML html={this.state.text_} />

我没有在我的代码中使用 WebView,所以我认为它在 react-native-html-render 库中使用。

我还尝试使用 react-native-webview 库来呈现 html 代码

<WebView
  source={{ html: this.state.text_ }}
/>

但是我得到了一个白屏

最佳答案

目前您对此无能为力,webView 已从 react-native 中删除,而 react-native-html-render 库尚未删除被更新。修复后的 PR 已经合并到 master 中,后续会在 npm 上进行测试和发布。

这是一个 Unresolved 问题:https://github.com/archriss/react-native-render-html/issues/265

作为等待 pkg 更新时的临时修复,您可以

  • 将 pkg 的版本更改为带有修复的 PR

"react-native-render-html": "^4.1.2"

"react-native-render-html": "git+https://github.com/chr314/react-native-render-html.git"

  • 手动安装

    npm install --save react-native-webview react-native link react-native-webview

然后在插件文件夹中,转到src/HTMLRenderers.js,删除{..} 'react-native'中的WebView; 并添加这一行 从 'react-native-webview' 导入 {WebView};

关于javascript - 错误 : Youtube link inside html text inside react native app,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57250387/

相关文章:

react-native - 错误 : Naming collision detected

react-native - React Native - undefined 不是对象(评估 'RNGestureHandlerModule.state')

javascript - innerHTML 不适用于某些标签,例如按钮或自定义标签

html - 这是一个 IE 错误吗? `body.foo.bar .container` 被应用于每个 body 元素

javascript - Douglas Crockford 所说的 'constructed in a different window or frame' 是什么意思?

javascript - Angularjs - ng grid 所选行的组名是什么

javascript - 当我将一个类分成两个类时,我的 javascript 中断了

react-native - 如何将导航器与 react native 侧菜单一起使用?

javascript - 如何使用 Braintree 在每月付款中每次折扣不同的值

javascript - 为什么我无法在 JavaScript 中通过键访问 JSON 对象?