使用addthis或外部javascript來更新div在聚合物元素陰影dom

Question

我想添加一些「addthis」按鈕到​​聚合物2.0應用程序中的元素。我可以導入「addthis」javascript，但它接收腳本本身需要更新作爲子元素一部分的「div」。 addthis腳本正在尋找class="addthis_inline_share_toolbox"這可能嗎？我認爲問題在於腳本無法在陰影中找到該類。我怎樣才能讓這個類從影子中獲得，以便腳本能夠找到它？有沒有辦法通過聚合物物業創造這種通道？

<dom-module id="poem-card"> 
<template> 
    <style> 
    :host { 
     display: block; 
    } 

    img { 
     width: 100% 
    } 

    paper-card { 
     --paper-card-header-text: { 
     font-family: 'Fascinate Inline', cursive; 
     color: yellow; 
     font-size: xx-large; 
     }; 
     --paper-card-header{ 
     position: 50%; 
     }; 
    } 
    .card-content *{ 
     margin: 8px 0; 
     font-weight: bold; 
     font-family: 'Alegreya Sans SC', sans-serif; 

    } 

    </style> 
    <iron-ajax 
    auto 
    url="https://api.json" 
    handle-as="json" 
    last-response="{{response}}"> 
    </iron-ajax> 
    <paper-card heading="{{response.items.0.title}}" image="https://placeimg.com/600/400/nature/sepia" alt="{{response.items.0.title}}"> 
     <div class="card-content"> 
     <p inner-h-t-m-l="{{response.items.0.content}}"></p> 
     </div> 
     <div class="card-actions"> 

     <div class="addthis_inline_share_toolbox"></div> 
     </div> 
    </paper-card> 



</template> 

<script> 
    /** 
    * `poem-card` 
    * an individual poem in card form 
    * 
    * @customElement 
    * @polymer 
    * @demo demo/index.html 
    */ 
    class PoemCard extends Polymer.Element { 
    static get is() { return 'poem-card'; } 
    static get properties() { 
     return { 
     prop1: { 
      type: String, 
      value: 'poem-card' 
     } 
     }; 
    } 
    } 

    window.customElements.define(PoemCard.is, PoemCard); 
</script> 

<script type="text/javascript" src="/addthis.js"></script> 

這裏

Answer 1

代碼Web組件影子DOM的想法是，沒有其他的腳本可以更改Web Compontnet的大教堂。所以要做到這一點，您需要爲外部腳本提供組件文檔的一個實例，如new addThis(Polymer.dom(this.root))。
這只是一半的事實，因爲這個anwser是聚合物2，如果你使用聚合物1，並告訴它使用陰暗的dom你的腳本可能會正常工作，因爲這個限制只適用於陰影dom。