本文实例为大家分享了微信小程序实现评论功能的具体代码,供大家参考,具体内容如下
前端
<textarea class=\'the_prw_in\' bindinput=\'bindblur\' cursor-spacing=\"130\" placeholder=\'说点什么吧...\' maxlength=\"76\">
</textarea>
<view class=\'the_prw_btn\' bindtap=\'btn_send\'>
留言
</view>
<view>评论内容:</view>
<block wx:for=\"{{pl_list}}\" wx:key=\"index\">
<view class=\'the_msg\' wx:if=\'{{item.input_value!=null}}\'>
<!-- <view class=\'msg_left\'>
<view class=\'msg_avatar_v\'>
<image class=\'msg_avatar\' src=\'{{msg_data.avatar}}\'></image>
</view>
</view> -->
<view class=\'msg_right\'>
<!-- <view class=\'msg_right_name\'>
{{msg_data.nicename}}
</view> -->
<view class=\'msg_right_text\'>
<text>{{item.input_value}}</text>
</view>
<view class=\'gap\'>
</view>
</view>
</view>
</block>
js: 默认展示历史评论,评论后也刷新页面,连带此次评论内容一起展示。
var bindblur ;
Page({
bindblur:function(e){
console.log(\'1111111:\', e.detail.value)
bindblur = e.detail.value;
},
: function (a) {
var that = this;
actid = a.id;
// 查询评论fetch
wx.request({
url: \'https://m.yishushe.net/addons/up_text.php\',
method: \'POST\',
header: {
\'content-Type\': \'application/x-www-form-urlencoded\',
\'Accept\': \'application/json\'
},
data: {
act_id: actid
},
success: function (result) {
that.setData({
pl_list: result.data.reverse(),
})
},
fail: res => {
wx.showToast({
: \'网络不好哟\',
image: \'/image/wrong.png\',
duration: 3000
})
}
})
},
btn_send: function () {
var that = this
//添加评论
console.log(\'文章id:act_id :\', actid);
console.log(\'用户缓存id:user_id :\', user_id);
console.log(\'文本输入框: input_value :\', bindblur);
wx.request({
url: \'https://m.yishushe.net/addons/up_text.php\',
method: \'POST\',
header: {
\'content-Type\': \'application/x-www-form-urlencoded\',
\'Accept\': \'application/json\'
},
data: {
act_id: actid,
user_id: user_id,
input_value: bindblur
},
success: function (result) {
that.setData({
pl_list: result.data.reverse(),
input_value: \"\",
})
},
fail: res => {
wx.showToast({
: \'网络不好哟\',
image: \'/image/wrong.png\',
duration: 3000
})
}
})
}
})
后端php 源码:
<?php
header(\"Content-Type:text/html;charset=utf8\");
header(\"Access-Control-Allow-Origin: *\"); //解决跨域
header(\'Access-Control-Allow-Methods:POST\');// 响应类型
header(\'Access-Control-Allow-Headers:*\'); // 响应头设置
$ =mysql_connect(\"localhost\",\"root\",\"root\");
mysql_select_db(\"weiqing\", $ ); //选择数据库
mysql_query(\"SET NAMES utf8\");//解决中文乱码问题
//$username = $_POST[\'username\'];
//$avatarUrl = $_POST[\'avatarUrl\'];
$act_id = $_POST[\'act_id\'];
if($_POST[\'input_value\']){
$user_id = $_POST[\'user_id\'];
$input_value = $_POST[\'input_value\'];
//echo $avatarUrl.\"----time:\". $time.\"----iv:\".$iv.\"----inputValue:\". $inputValue;
//插入数据到数据库
$strsql = \"insert into pinglun (act_id,user_id,input_value) values(\'$act_id\',\'$user_id\',\'$input_value\')\";
//mysql_query() 函数执行一条 MySQL 查询。SELECT,SHOW,EXPLAIN 或 DESCRIBE 都需要用这个函数执行
$result = @mysql_query($strsql);
}
$q = \"SELECT * FROM pinglun\"; //SQL查询语句 SELECT * FROM 表名
$rs = mysql_query($q); //获取数据集
if(!$rs){die(\"数据库没有数据!\");}
//循环读取数据并存入数组对象
$dlogs;$i=0;
while($row=mysql_fetch_array($rs))
{
if($act_id ==$row[\"act_id\"]){
$dlog[\"act_id\"]=$row[\"act_id\"];
$dlog[\"user_id\"]=$row[\"user_id\"];
$dlog[\"input_value\"]=$row[\"input_value\"];
}
//$dlog[\"avatarUrl\"]=$row[\"avatarUrl\"];
//$dlog[\"username\"]=$row[\"username\"];
$dlogs[$i++]=$dlog;
}
//以json格式返回html页面
echo urldecode(json_encode($dlogs));
?>
如果php返回报错就找到php-ini 配置文件 ,把
display_errors = On
改为
display_errors = Off
禁止php报错
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
继续阅读与本文标签相同的文章
-
在 NAS SMB 卷上搭建 IIS + WordPress + MYSQL
2026-05-19栏目: 教程
-
SpringBoot2 整合 ElasticSearch框架,实现高性能搜索引擎
2026-05-19栏目: 教程
-
大神引路:新手云大使入门导引
2026-05-19栏目: 教程
-
一行命令导致的数据丢失,阿里工程师是如何恢复的?
2026-05-19栏目: 教程
-
二层、三层、四层交换机的区别!!
2026-05-19栏目: 教程
