您现在的位置是：首页 > cms教程 > PbootCMS教程PbootCMS教程

pbootcms百度小程序怎么添加评论模块

雷亚思2024-12-19PbootCMS教程已有人查阅

导读本文使用的小程序模板是之前文章中用到的，这里主要用于记录一下添加评论模块的流程。1：app.json中添加动态库引用。2：前端页面添加.swan(官方示例)

本文使用的小程序模板是之前文章中用到的，这里主要用于记录一下添加评论模块的流程。
1：app.json中添加动态库引用

"window": {
"backgroundTextStyle": "dark",
"navigationBarBackgroundColor": "#139b97",
"navigationBarTitleText": "剪力墙钢支撑厂家",
"navigationBarTextStyle": "black",
"backgroundColor": "#eeeeee",
"onReachBottomDistance": 50,
"enablePullDownRefresh": true
},
//动态库引用
"dynamicLib": {
"myDynamicLib": {
"provider": "swan-interaction"
}
},

2：前端页面添加.swan(官方示例)

<!-- 评论相关开始-->
<view class="text_b">
<text>全部回复</text>
<!-- <text class="item-meta">{{item.sortname}}</text> -->
</view>
<comment-list class="list" comment-param="{{commentParam}}"
detail-path="{{detailPath}}" is-folded="{{true}}" fold-num="{{foldNum}}" view-more-path="{{viewMorePath}}" toolbar-config="{{toolbarConfig}}" bindclickcomment="clickComment" bindviewmore="viewMore">
</comment-list>
<view class="list-after"></view>
<!-- 评论相关结束-->

3：后台.json文件

{
"navigationBarTitleText": "评论列表",
"usingSwanComponents": {
"comment-list": "dynamicLib://myDynamicLib/comment-list"
}
}
4:.css样式
.list-after {
height: 200rpx;
}
5.js文件
Page({
data: {
siteurl: t.siteurl,
subtitle:t.info.subtitle,
title:'新闻信息',
scode:t.info.id,
description :'',
// 关注评论开始
commentParam: {
snid: 1,
path: 'pages/index/index',
title: '文章标题',
content: '百度小程序',
images: []
},
detailPath: '',
foldNum: 5,
toolbarConfig: {
moduleList: ['comment', 'like', 'favor', 'share']
}
//结束
},
onlod中this.setData
this.setData({
detaildata: res.data.data,
imgUrls:imgUrls,
sitedata:sitedata,
'toolbarConfig.placeholder': '吐槽一下',
'toolbarConfig.share.title': res.data.data.title.substring(0, 15),//这里是分享按钮使用，没有的话点击分享不起作用
'toolbarConfig.share.path': '/pages/news-detail/news-detail?id=' + res.data.data.id,
commentParam: {
snid: res.data.data.id,
path: '/pages/news-detail/news-detail?id=' + res.data.data.id,
title: res.data.data.title,
content: res.data.data.description.replace(/<[^>]+>/g, "").substring(0, 15),
images: [res.data.data.ico]
}
})
onReady中添加
onReady: function () {
requireDynamicLib('myDynamicLib').listenEvent();
},