• like 點(diǎn)贊
  • 屬性說明
    • like-param 點(diǎn)贊服務(wù)參數(shù)說明
  • 示例
    • 使用方式
    • 代碼示例
  • Bug & Tip

like 點(diǎn)贊

解釋：通過點(diǎn)贊組件，用戶可以對文章內(nèi)容或者評論內(nèi)容進(jìn)行點(diǎn)贊，被點(diǎn)贊的用戶可以收到消息通知。更多點(diǎn)贊設(shè)計指引，詳見如何提升小程序互動體驗(yàn)。

公司主營業(yè)務(wù)：成都做網(wǎng)站、成都網(wǎng)站設(shè)計、移動網(wǎng)站開發(fā)等業(yè)務(wù)。幫助企業(yè)客戶真正實(shí)現(xiàn)互聯(lián)網(wǎng)宣傳，提高企業(yè)的競爭能力。創(chuàng)新互聯(lián)是一支青春激揚(yáng)、勤奮敬業(yè)、活力青春激揚(yáng)、勤奮敬業(yè)、活力澎湃、和諧高效的團(tuán)隊。公司秉承以“開放、自由、嚴(yán)謹(jǐn)、自律”為核心的企業(yè)文化，感謝他們對我們的高要求，感謝他們從不同領(lǐng)域給我們帶來的挑戰(zhàn)，讓我們激情的團(tuán)隊有機(jī)會用頭腦與智慧不斷的給客戶帶來驚喜。創(chuàng)新互聯(lián)推出海淀免費(fèi)做網(wǎng)站回饋大家。

屬性說明

like-param 點(diǎn)贊服務(wù)參數(shù)說明

snid 和 spid 分別是文章內(nèi)容和評論內(nèi)容的唯一標(biāo)識，由開發(fā)者創(chuàng)建和維護(hù)。當(dāng)對文章內(nèi)容進(jìn)行點(diǎn)贊時，只需要填寫 snid ；當(dāng)對文章下某一評論進(jìn)行點(diǎn)贊時，需要填寫 snid 和 spid 。

示例

跳轉(zhuǎn)編輯工具

在開發(fā)者工具中打開

在 WEB IDE 中打開

掃碼體驗(yàn)

代碼示例

請使用百度APP掃碼

使用方式

方式一：npm 引入

 
 
 

  
  
  
# 進(jìn)入項(xiàng)目根目錄, 路徑以./projectRoot為例
  
  
  
cd ./projectRoot
  
  
  
# 未安裝過點(diǎn)贊組件
  
  
  
npm install @smt-ui/content-component
  
  
  
# 以前安裝過點(diǎn)贊組件
  
  
  
npm update
 
 
 

• JSON

 
 
 

  
  
  
{
  
  
  
 "usingComponents": {
  
  
  
 "smt-like": "@smt-ui/content-component/src/like"
  
  
  
 }
  
  
  
}
 
 
 

方式二：動態(tài)庫引入

在 app.json 中引入內(nèi)容服務(wù)組件動態(tài)庫。

• JSON

 
 
 

  
  
  
{
  
  
  
 "dynamicLib": {
  
  
  
 "myDynamicLib": {
  
  
  
 "provider": "smart-sc"
  
  
  
 }
  
  
  
 }
  
  
  
}
 
 
 

在頁面配置 JSON 文件中，以動態(tài)庫方式引入。

• JSON

 
 
 

  
  
  
{
  
  
  
 "usingComponents": {
  
  
  
 "smt-like": "dynamicLib://myDynamicLib/like"
  
  
  
 }
  
  
  
}
 
 
 

代碼示例

• SWAN
• JS

 
 
 

  
  
  

  
  
  

  
  
  

  
  
  
 
  
  
  
 圖標(biāo)按鈕樣式
  
  
  
 
  
  
  
 

  
  
  
 class="custom-class"
  
  
  
 like-param="{{likeParam}}"
  
  
  
 bind:error="error"
  
  
  
 bind:success="clicksucc">
  
  
  
 
  
  
  
 

  
  
  
 icon-type="heart"
  
  
  
 like-param="{{likeParam}}"
  
  
  
 bind:error="error">
  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
 組合按鈕樣式
  
  
  
 
  
  
  
 

  
  
  
 class="custom-class-mixture"
  
  
  
 mode="mixture"
  
  
  
 like-param="{{likeParam}}"
  
  
  
 like-text="{{likeText}}"
  
  
  
 bind:error="error">
  
  
  
 
  
  
  
 

  
  
  
 class="custom-class-mixture"
  
  
  
 likeNum="12"
  
  
  
 mode="mixture"
  
  
  
 icon-type="heart"
  
  
  
 like-param="{{likeParam}}"
  
  
  
 like-text="{{likeText}}"
  
  
  
 bind:error="error">
  
  
  
 
  
  
  
 

  
  
  
 class="custom-class-mixture"
  
  
  
 mode="mixture"
  
  
  
 style="border"
  
  
  
 like-param="{{likeParam}}"
  
  
  
 like-text="{{likeText}}"
  
  
  
 bind:error="error">
  
  
  
 
  
  
  
 

  
  
  
 mode="mixture"
  
  
  
 likeNum="12"
  
  
  
 style="border"
  
  
  
 icon-type="heart"
  
  
  
 like-param="{{likeParam}}"
  
  
  
 bind:error="error">
  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
 動效組合樣式1
  
  
  
 
  
  
  
 
  
  
  
 

  
  
  
 animation-type="{{0}}"
  
  
  
 like-param="{{likeParam}}"
  
  
  
 bind:success="clicksucc"
  
  
  
 bind:error="error">
  
  
  
 
  
  
  
 無動效
  
  
  
 
  
  
  
 
  
  
  
 

  
  
  
 like-param="{{likeParam}}"
  
  
  
 bind:success="clicksucc"
  
  
  
 bind:error="error">
  
  
  
 
  
  
  
 輕動效
  
  
  
 
  
  
  
 
  
  
  
 

  
  
  
 animation-type="{{2}}"
  
  
  
 like-param="{{likeParam}}"
  
  
  
 bind:success="clicksucc"
  
  
  
 bind:error="error">
  
  
  
 
  
  
  
 強(qiáng)動效
  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
 動效組合樣式2
  
  
  
 
  
  
  
 
  
  
  
 

  
  
  
 icon-type="heart"
  
  
  
 animation-type="{{0}}"
  
  
  
 like-param="{{likeParam}}"
  
  
  
 bind:success="clicksucc"
  
  
  
 bind:error="error">
  
  
  
 
  
  
  
 無動效
  
  
  
 
  
  
  
 
  
  
  
 

  
  
  
 icon-type="heart"
  
  
  
 like-param="{{likeParam}}"
  
  
  
 bind:success="clicksucc"
  
  
  
 bind:error="error">
  
  
  
 
  
  
  
 輕動效
  
  
  
 
  
  
  
 
  
  
  
 

  
  
  
 icon-type="heart"
  
  
  
 animation-type="{{2}}"
  
  
  
 like-param="{{likeParam}}"
  
  
  
 bind:success="clicksucc"
  
  
  
 bind:error="error">
  
  
  
 
  
  
  
 強(qiáng)動效
  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
 點(diǎn)擊提示反饋
  
  
  
 
  
  
  
 

  
  
  
 is-show-toast="{{true}}"
  
  
  
 like-param="{{likeParam}}"
  
  
  
 bind:success="clicksucc"
  
  
  
 bind:error="error">
  
  
  
 
  
  
  
 
  
  
  
 
  
  
  
 
  
  
  

 
 
 

 
 
 

  
  
  
Page({
  
  
  
 data: {
  
  
  
 likeParam: {}
  
  
  
 },
  
  
  
 onLoad() {
  
  
  
 const pageStack = getCurrentPages();
  
  
  
 const currentPage = pageStack[pageStack.length - 1];
  
  
  
 const privateProperties = currentPage.privateProperties || {};
  
  
  
 const currentUri = privateProperties.accessUri || currentPage.uri;
  
  
  
 const snid = 'test_snid';
  
  
  
 this.setData('likeParam', {
  
  
  
 snid: snid,
  
  
  
 spid: '' + Date.now(),
  
  
  
 openid: 'mVMFstfXtsndgnRObr7BoP9hoL',
  
  
  
 title: '我是文章標(biāo)題',
  
  
  
 path: currentUri + '&snid=' + snid
  
  
  
 });
  
  
  
 },
  
  
  
 error() {
  
  
  
 // 在使用 npm 方式引入點(diǎn)贊組件時，點(diǎn)擊按鈕時在用戶未登錄狀態(tài)下會觸發(fā)此事件，建議提前引導(dǎo)用戶完成登錄
  
  
  
 }
  
  
  
});