이 글에서는 주로 Vue를 Facebook, Twitter를 활용하여 공유하는 사례를 소개하고 참고용으로 올려드립니다.
vue 사용 공유 기록
고정 콘텐츠 공유 참조 문서
facebook 공유 문서
twitter 공유 문서
vue 사용
facebook 사용 공유
index.html을 찾아 코드를 추가
<!-- facebook 分享 --> <p id="fb-root"></p> <script>(function (d, s, id) { var js, fjs = d.getElementsByTagName(s)[0]; if (d.getElementById(id)) return; js = d.createElement(s); js.id = id; js.src = 'https://connect.facebook.net/zh_CN/sdk.js#xfbml=1&version=v2.12&appId=你的APPID&autoLogAppEvents=1'; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk')); </script>
사용
첫 번째 방법 html
<p class="fb-share-button" data-href="http://dev.XXXX.io/" data-layout="button_count" data-size="small" data-mobile-iframe="true"> <a target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fdevelopers.facebook.com%2Fdocs%2Fplugins%2F&src=sdkpreparse" class="fb-xfbml-parse-ignore">分享</a> </p>
두 번째 방법 js
facebook() { // 初始化 FB.init({ appId: 你的appid, autoLogAppEvents: true, xfbml: true, version: "v2.12" }); FB.ui( { method: "share", mobile_iframe: true, href: "http://dev.XXXX.io/?test=12345" }, function(response) {} ); },
twitter 사용 share
index.html 찾기 코드 추가
<!-- twitter 分享 --> <script>window.twttr = (function (d, s, id) { var js, fjs = d.getElementsByTagName(s)[0], t = window.twttr || {}; if (d.getElementById(id)) return t; js = d.createElement(s); js.id = id; js.src = "https://platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore(js, fjs); t._e = []; t.ready = function (f) { t._e.push(f); }; return t; }(document, "script", "twitter-wjs")); </script>
vue 페이지에서 사용
xxx.vue에서
<p class="twitter-share-button" id="container"></p>
javascript 추가 code
twitter() { console.log(twttr) twttr.widgets.createShareButton( "http://dev.XXXX.io/?test=12345", document.getElementById("container"), { text: "分享测试", size: "large", hashtags: "example,demo", via: "twitterdev", related: "twitterapi,twitter" } ); }
위 내용은 제가 모두를 위해 정리한 내용입니다. 앞으로 모든 분들께 도움이 되기를 바랍니다.
관련 기사:
Vue.js 프로젝트 API 및 라우터 구성 분할 실습에 대한 자세한 설명
NodeJS 방법으로 되돌릴 수 없는 암호화 및 암호 암호문 저장을 구현합니다.
위 내용은 Vue는 facebook twitter 공유 예제를 사용합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!