最代碼廣告位
最代碼人間蒸發的gravatar頭像
最代碼人間蒸發2019-12-16 14:29:10
沙雕程序員(九)—— vue中使用gitalk,給自己的博客加個評論。

先貼個官方中文說明,https://github.com/gitalk/gitalk/blob/master/readme-cn.md

1.引入

   有倆種引入方式,這里我用了第一種,省事,而且節約你服務器空間!

   在你的index.html中引入

  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/gitalk.css">
  <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/gitalk.min.js"></script>

  <!-- or -->

  <link rel="stylesheet" href="https://unpkg.com/gitalk/dist/gitalk.css">
  <script src="https://unpkg.com/gitalk/dist/gitalk.min.js"></script>

2.申請GitHub Application

重點說明一下,你必須得是上線的項目才可以申請,無線上項目申請的最后出不來。

申請地址,https://github.com/settings/applications/new ,如下圖

沙雕程序員(九)—— vue中使用gitalk,給自己的博客加個評論。

注冊成功,在下圖中你會找到你的注冊好的應用,我的應用如下圖

沙雕程序員(九)—— vue中使用gitalk,給自己的博客加個評論。

此時,你需要記住上圖中Client ID和Client Secret。

3.在github創建一個新的倉庫,在issues中存這些評論,我的新倉庫如下圖

沙雕程序員(九)—— vue中使用gitalk,給自己的博客加個評論。

名字沒必要和你的應用名稱一樣。

4.應用

在你需要寫評論的位置加入

<div class="social-section">

    <div id="gitalk-container" ></div>

 </div> 

var gitalk = new Gitalk({
    clientID: '你的Client ID',
    clientSecret: '你的Client Secret',
    repo: '你的新創建倉庫名稱',
    owner: '新倉庫所屬人',
    admin: ['新倉庫的所屬人'],//如果此倉庫有多個開發中,以數組的格式加入
    id: location.pathname //用于標記評論是哪個頁面的,確保唯一,并且長度小于50
})

5.效果圖!

沙雕程序員(九)—— vue中使用gitalk,給自己的博客加個評論。

點擊綁定即可,此處當時遇到坑,跳轉到綁定頁面就沒有反應了,如果大家出現此問題,換臺網絡好的電腦再試試!

終極效果如下圖

沙雕程序員(九)—— vue中使用gitalk,給自己的博客加個評論。

6.查看評論

到你新創建的倉庫中,在issues中即可看到

沙雕程序員(九)—— vue中使用gitalk,給自己的博客加個評論。

至此,全文結束,拜了個拜,有問題群里聯系我!


打賞
最近瀏覽
zhoujie123800 LV62月18日
月亮星星星星
java和python的女兒 LV131月16日
月亮月亮月亮星星
eiven_pro LV21月16日
星星星星
最代碼故戌 LV201月16日
太陽月亮
隨心隨意1月14日
暫無貢獻等級
我去買G橘子 LV61月11日
月亮星星星星
myjaychou LV31月10日
星星星星星星
程序員文 LV61月10日
月亮星星星星
是非黑白 LV81月10日
月亮月亮
頂部客服微信二維碼底部
>掃描二維碼關注最代碼為好友掃描二維碼關注最代碼為好友
2008大乐透走势图