Question

反应添加嵌入式评论问题：

我将带有嵌入式脚本代码的Yelp评论粘贴到我的应用程序中。审查呈现完美（本地尚未尝试部署应用程序），但我在控制台中收到一个奇怪的JSON错误：

VM1040:1 Uncaught SyntaxError: Unexpected token s in JSON at position 0
    at Object.parse (<anonymous>)
    at i (VM1027 widgets.js:1)
    at VM1027 widgets.js:1

我尝试了几种不同的方法将评论粘贴到我的React组件中，这两种方法都会呈现评论，但是仍然会出现相同的错误。有人可以指导我如何找到解决方案吗？

回购：https://github.com/tarekel96/gtrHighPerformance/blob/master/client/src/components/Customers/YelpOne/index.js

我的方法包括使用文档api创建脚本元素，然后将脚本附加到主体和ID为'root'的React div中。

// first method I tried
  componentDidMount() {
    if (!window.doBuild) {
      this.preloadWidgetScript();
    } else {
      window.doBuild();
    }
  }

  preloadWidgetScript = () => {
    const script = document.createElement("script");
    script.async = true;
    script.dataset.pinBuild = "doBuild";
    script.src = "//www.yelp.com/embed/widgets.js";
    document.body.appendChild(script);
  };
// end first method

  // second method I tried
   componentDidMount() {
     const script = document.createElement("script");
     script.setAttribute("src", "https://www.yelp.com/embed/widgets.js");
     document.getElementById("root").appendChild(script);
   }
// end second method

render() {
    return (
     // embedded Yelp review code start
            <span
              className="yelp-review"
              data-review-id="CPZ43GwBDsLfZLaBpDPxFQ"
              data-hostname="www.yelp.com"
            >
              <a
                href="https://www.yelp.com/user_details?userid=nQjhEXRd9n1vON50NZnOCA"
                rel="nofollow noopener"
              >
                Jeff H.
              </a>

              <a
                href="https://www.yelp.com/biz/gtr-high-performance-rancho-cucamonga?hrid=CPZ43GwBDsLfZLaBpDPxFQ"
                rel="nofollow noopener"
              >
                review
              </a>

              <a
                href="https://www.yelp.com/biz/xqUYSbS_GP3TKK3ooYgpNA"
                rel="nofollow noopener"
              >
                GTR High Performance
              </a>
              <a href="https://www.yelp.com" rel="nofollow noopener">
                Yelp
              </a>
            </span>
// embedded Yelp review code end

将嵌入式Yelp评论添加到React应用程序时遇到问题

0 个答案: