微信小程序实现评论功能

程序员文章站 2023-12-03 16:16:22

本文实例为大家分享了微信小程序实现评论功能的具体代码，供大家参考，具体内容如下前端

<div class="content">
						<p>本文实例为大家分享了微信小程序实现评论功能的具体代码，供大家参考，具体内容如下<br></p>
<p>前端</p>
<div class="jb51code">
<pre class="brush: javascript;">
<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_right'>
 
<view class='msg_right_text'>
 <text>{{item.input_value}}</text>
  </view>
   <view class='gap'>
   </view>
    </view>
   </view>
</block></pre>
</div>
<p>js: 默认展示历史评论，评论后也刷新页面，连带此次评论内容一起展示。</p>
<div class="jb51code">
<pre class="brush: javascript;">
var bindblur ;
page({
 bindblur:function(e){
 console.log('1111111:', e.detail.value)
 bindblur = e.detail.value;
 },
 
 onload: 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({
  title: '网络不好哟',
  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({
  title: '网络不好哟',
  image: '/image/wrong.png',
  duration: 3000
 })
 }
 })
 }
})</pre>
</div>
<p>后端php 源码：</p>
<div class="jb51code">
<pre class="brush: javascript;">
<?php
 header("content-type:text/html;charset=utf8"); 
 header("access-control-allow-origin: *"); //解决跨域
 header('access-control-allow-methods:post');// 响应类型 
 header('access-control-allow-headers:*'); // 响应头设置 
 $link=mysql_connect("localhost","root","root"); 
 mysql_select_db("weiqing", $link); //选择数据库
 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));
?></pre>
</div>
<p>如果php返回报错就找到php-ini 配置文件 ，把</p>
<blockquote>
<p>display_errors = on<br>
改为<br>
display_errors = off<br></p>
</blockquote>
<p><span style="color: #800000"><strong>禁止php报错<br></strong></span></p>
<p>以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。</p>					</div>
																				<div class="info-pre-next">
						<p>
							上一篇：							<a href="/article/2218639.html">
								微信小程序自定义底部导航带跳转功能							</a>
						</p>
						<p>
							下一篇：							<a href="/article/2218642.html">
								mysql5.7.17安装使用图文教程							</a>
						</p>
					</div>
															<div class="wz_tuijian">
						<p>
							推荐阅读						</p>
						<ul>
														<li>
								<a href="/article/2218781.html" target="_blank" title="30分钟快速实现小程序语音识别功能">
									<h2>
										30分钟快速实现小程序语音识别功能									</h2>
								</a>
							</li>
														<li>
								<a href="/article/2218623.html" target="_blank" title="详解微信小程序胶囊按钮返回|首页自定义导航栏功能">
									<h2>
										详解微信小程序胶囊按钮返回|首页自定义导航栏功能									</h2>
								</a>
							</li>
														<li>
								<a href="/article/2218650.html" target="_blank" title="微信小程序实现点击图片旋转180度并且弹出下拉列表">
									<h2>
										微信小程序实现点击图片旋转180度并且弹出下拉列表									</h2>
								</a>
							</li>
														<li>
								<a href="/article/2218576.html" target="_blank" title="微信小程序实现时间预约功能">
									<h2>
										微信小程序实现时间预约功能									</h2>
								</a>
							</li>
														<li>
								<a href="/article/2218639.html" target="_blank" title="微信小程序自定义底部导航带跳转功能">
									<h2>
										微信小程序自定义底部导航带跳转功能									</h2>
								</a>
							</li>
														<li>
								<a href="/article/2218640.html" target="_blank" title="微信小程序实现评论功能">
									<h2>
										微信小程序实现评论功能									</h2>
								</a>
							</li>
														<li>
								<a href="/article/2218472.html" target="_blank" title="微信小程序版本自动更新的方法">
									<h2>
										微信小程序版本自动更新的方法									</h2>
								</a>
							</li>
														<li>
								<a href="/article/2218501.html" target="_blank" title="微信小程序实现日历功能">
									<h2>
										微信小程序实现日历功能									</h2>
								</a>
							</li>
														<li>
								<a href="/article/2217628.html" target="_blank" title="微信小程序缓存过期时间的使用详情">
									<h2>
										微信小程序缓存过期时间的使用详情									</h2>
								</a>
							</li>
														<li>
								<a href="/article/2217373.html" target="_blank" title="小程序用什么开发，微信小程序开发所需知识">
									<h2>
										小程序用什么开发，微信小程序开发所需知识									</h2>
								</a>
							</li>
													</ul>
					</div>
									</article>
			</div>
            			
		</main>
		<footer><div class="box"><div class="ft_nav"><div class="ft_about"><p>关于网站</p><ul><li><a href="/sitemap.xml" target="_blank" title="网站地图">网站地图</a></li><li><a href="/list/2/" title="最新程序员文章站">最新程序员文章站</a></li></ul></div><div class="ft_contact"><ul><li>本站所有数据收集于网络如有侵犯到您的权益，请联系我们进行下架处理。</li><li class="email_show"></li></ul></div></div><div class="copyright"><div class="cr_left"><p> 备案号：<a href="https://beian.miit.gov.cn/#/Integrated/index" target="_blank">粤ICP备20058927号</a></p><p>© Copyright © 2020-2022 www.superweb999.com 程序员文章站. </p></div></div></div></footer>	</body>
	</html>