Question

我正在尝试使用Pinterest的保存按钮（https://developers.pinterest.com/docs/widgets/save/）上。

在componentDidMount中，我将脚本添加到页面中，如下所示：

componentDidMount() {
    const pinitScript = document.createElement('script');
    pinitScript.setAttribute('src', '//assets.pinterest.com/js/pinit.js');
    pinitScript.type = 'text/javascript';
    pinitScript.async = true;
    pinitScript.defer = true;

    const firstScript = document.getElementsByTagName("SCRIPT")[0];
    firstScript.parentNode.insertBefore(pinitScript, firstScript);
}

我正在使用带有自定义共享网址的Pinterest推荐的按钮代码：

<a 
    href="https://www.pinterest.com/pin/create/button/" 
    data-pin-do="buttonBookmark" 
    data-pin-url={this.props.url} 
/>

我的理解是，该脚本应该查看DOM，找到具有指定Pinterest属性的锚元素，并用一个链接来替换/修改它，该链接将显示图像选择器，如果用户选择了图像，，与data-pin-url中设置的网址共享图像。

相反，执行脚本后，图像选择器模式就会出现在我的页面上，并且不使用我指定的data-pin-url。似乎我缺少与pinit.js / pinit_main.js如何找到<a>元素有关的基本知识，但我不确定是什么。

我已确认定位标记位于DOM中，且格式符合预期：

<a href="https://www.pinterest.com/pin/create/button/" data-pin-do="buttonBookmark" data-pin-url="https://www.myshareurl.com"></a>

为什么在执行pinit脚本时立即呈现Pinterest Image Picker表单？

0 个答案: