Twitter API с JS реагировать

мне удалось получить следующую кнопку щебетать счета работать с прореагировать с этим кодом:Twitter API с JS реагировать

class TwitterShareButton extends React.Component { 
    render() { 
    return <a href="https://twitter.com/share" className="twitter-share-button">Tweet</a> 
    } 

    componentDidMount() { 
    var scriptNode = document.getElementById('twitter-wjs') 
    if (scriptNode) { 
     scriptNode.parentNode.removeChild(scriptNode) 
    } 

    !function(d,s,id){ 
     var js, 
      fjs=d.getElementsByTagName(s)[0], 
      p=/^http:/.test(d.location)?'http':'https'; 
     if(!d.getElementById(id)){ 
     js=d.createElement(s); 
     js.id=id; 
     js.src=p+'://platform.twitter.com/widgets.js'; 
     fjs.parentNode.insertBefore(js,fjs); 
     } 
    }(document, 'script', 'twitter-wjs'); 
    } 
}

из http://qiita.com/h_demon/items/95e638666f6bd479b47b

Как я могу связать события? https://dev.twitter.com/web/javascript/events

Я добавил

var twttr = document.getElementById('twitter-wjs') 

twttr.ready(function (twttr) { 
    // Now bind our custom intent events 
    twttr.events.bind('click', clickEventToAnalytics); 
    twttr.events.bind('tweet', tweetIntentToAnalytics); 
    twttr.events.bind('retweet', retweetIntentToAnalytics); 
    twttr.events.bind('like', likeIntentToAnalytics); 
    twttr.events.bind('follow', followIntentToAnalytics); 
});

к componentDidMount. Это не сработало.

источник

2016-01-26 user3918985

Где функции обратного вызова в вашем коде? Кроме того, что не получилось? Есть ли конкретная ошибка, которую вы получаете? –

события клика не работают - я хочу отслеживать, когда кнопка нажата или когда учетная запись выполняется. – user3918985

Просто используйте window.twttr, а не document.getElementById - и сделайте это внутри componentDidMount.

import ReactDOM from 'react-dom'; 
import React from 'react'; 

class AppComponent extends React.Component { 
    render() { 
    return (
     <a href='https://twitter.com/share' className='twitter-share-button' ref='share' data-url='https://twitter.com/'>Tweet</a> 
    ); 
    } 

    onClick() { 
    console.log("Clicked"); 
    } 

    componentDidMount() { 
    window.twttr.events.bind('click', this.onClick); 
    } 
} 

ReactDOM.render(<AppComponent />, document.getElementById('app'));

<!doctype html> 
<html> 
<head> 
    <title>Twitter Share</title> 
</head> 
<body> 
    <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs'); 
    </script> 
    <div id="app"></div> 
    <script type="text/javascript" src="assets/app.js"></script> 
</body> 
</html>

Редактировать, чтобы принять во внимание мнение: Согласно документации here и что сценарий вы в том числе внутри вашего index.html делает, window.twttr назначается и готов для использования. Вам не нужно обращаться к каким-либо другим элементам - перейдите прямо к использованию window.twttr, чтобы связать события. Существует привязка для кликов, вы можете добавить больше, как вам нравится, и назначить им соответствующие обратные вызовы, которые вы создаете.

источник

2016-01-28 15:15:05 Andreas

Не используйте сокращенные URL-адреса, они могут исчезнуть без предупреждения. Также лучше иметь весь код здесь, а не во внешней ссылке, поскольку это может измениться или исчезнуть. – DavidG

Добавьте объяснение для кода, поэтому ОП понимает, в чем проблема. –

Намного лучше, молодец! О, и нет необходимости иметь код как фрагмент, так как он не может быть запущен, достаточно простых блоков кода. – DavidG

Twitter API с JS реагировать

ответ

Смежные вопросы