php微信小程序 留言功能,微信小程序评论/留言功能,附:前端+后端代码+视频讲解!...
前端界面:
(此图片来源于网络,如有侵权,请联系删除! )
演示:
(此图片来源于网络,如有侵权,请联系删除! )
授权登录
留言
{{item.result}}
以下是留言内容
{{item.nickname}} {{item.lytime}}
{{item.liuyantext}}
//index.js
//获取应用实例
const app = getApp()
Page({
/**
* 页面的初始数据
*/
data: {
},
//授权登录
login: function () {
var that = this;
// 查看是否授权
wx.getSetting({
success(res) {
if (res.authSetting['scope.userInfo']) {
// 已经授权,可以直接调用 getUserInfo 获取头像昵称
wx.getUserInfo({
success: function (res) {
console.log(res.userInfo),
that.setData({
nickName: res.userInfo.nickName,
avatarUrl: res.userInfo.avatarUrl,
})
}
})
}
}
})
},
bindGetUserInfo(e) {
console.log(e.detail.userInfo)
},
formSubmit: function (e) {
wx.showToast({
title: '已留言',
icon: 'success'
})
var that = this;
var liuyantext = e.detail.value.liuyantext; //获取表单所有name=liuyantext的值
var nickName = e.detail.value.nickname; //获取表单所有name=nickName的值
var headimg = e.detail.value.headimg; //获取表单所有name=headimg的值
wx.request({
url: 'http://localhost/liuyanserver/liuyan.php?liuyantext=' + liuyantext + '&nickname=' + nickName + '&headimg=' + headimg,
data: {
liuyantext,
nickName,
headimg
},
header: { 'Content-Type': 'application/json' },
success: function (res) {
console.log(res.data)
that.setData({
re: res.data,
})
wx.hideToast();
}
})
},
onPullDownRefresh: function () {
wx.showNavigationBarLoading();
var that = this
wx.request({
url: 'http://localhost/liuyanserver/loadliuyan.php',
headers: {
'Content-Type': 'application/json'
},
success: function (res) {
//将获取到的json数据,存在名字叫list的这个数组中
that.setData({
liuyanlist: res.data,
//res代表success函数的事件对,data是固定的,liuyanlist是数组
})
// 隐藏导航栏加载框
wx.hideNavigationBarLoading();
// 停止下拉动作
wx.stopPullDownRefresh();
}
})
},
//加载最新数据
onLoad: function () {
var that = this
wx.request({
url: 'http://localhost/liuyanserver/loadliuyan.php',
headers: {
'Content-Type': 'application/json'
},
success: function (res) {
//将获取到的json数据,存在名字叫list的这个数组中
that.setData({
liuyanlist: res.data,
//res代表success函数的事件对,data是固定的,liuyanlist是数组
})
}
})
}
})
/**index.wxss**/
.input-style{
width: 90%;
height: 50px;
border:1px solid #ccc;
margin:10px auto;
}
.btn{
width: 88%;
margin:5px auto;
}
.liuyanview{
width: 90%;
margin: 10px auto;
}
.result{
text-align: center;
font-size: 14px;
color: #f00;
margin-top: 20px;
}
.headimg{
width: 45px;
height: 45px;
border-radius: 100%;
}
.headimg image{
width: 45px;
height: 45px;
border-radius: 100%;
}
.nickname_liuyantext{
width: calc(100% - 55px);
float: right;
margin-top:-45px;
}
.nickname_liuyantext .nickname{
font-size: 15px;
color: #999;
}
.nickname_liuyantext .nickname .time{
font-size: 11px;
color: #999;
float: right;
}
.nickname_liuyantext .text{
font-size: 16px;
color: #666;
}
以上是前端部分
后端有两个文件。
数据库格式:
(此图片来源于网络,如有侵权,请联系删除! )
免责声明:本站所有文章和图片均来自用户分享和网络收集,文章和图片版权归原作者及原出处所有,仅供学习与参考,请勿用于商业用途,如果损害了您的权利,请联系网站客服处理。
php微信小程序 留言功能,微信小程序评论/留言功能,附:前端+后端代码+视频讲解!...相关推荐
- 微信小程序评论/留言功能,附:前端+后端代码+视频讲解!
前端界面: 演示: <!-- 表单 --> <form bindsubmit="formSubmit"> <input type="text ...
- 微信小程序wx.login()获取openid,附:前端+后端代码(超详细版)
微信小程序开放了微信登录的api,无论是个人还是企业申请的小程序均可使用. 首先创建一个项目,把这些代码都清空,我们自己写! 然后,开始写了! 首先index.wxml,写一个button用于发起登录 ...
- 微信小程序——从后台获取数据库数据并在前台显示(前端+后端+数据库)
因为人工测试的时候需要统计数据都在纸上,统计起来很麻烦.所以我想做个小程序来辅助我测试,但我之前没学过小程序,所以就一点一点搞吧.今天这篇主要讲从后台获取数据库数据并在前台显示(类似背单词小程序的点击 ...
- Unity3d(webGL)构建数字孪生小案例(包含完整的数据交互体系)附赠完整代码
先来看看概念吧: 数字孪生体是现有或将有的物理实体对象的数字模型, 通过实测.仿真和数据分析来实时感知.诊断.预测物理实体对象的状态, 通过优化和指令来调控物理实体对象的行为, 通过相关数字模型间的相 ...
- java评论回复功能例子_Java实现评论回复功能的完整步骤
前言 使用递归循环开发评论回复功能,适用于大部分的简单单体应用 评论功能或许是大多数的单体应用之中会用到的功能,我们会在自己所开发的项目之中进行集成该功能 大多数时候我们会将评论功能划分成以下几种: ...
- php获取微信小程序用户头像,微信小程序获取用户头像+昵称+openid,小程序登录!附前端后端源码!...
做一款小程序,如果需要判断用户,当然要获取一些基本信息,例如头像,昵称,openid.所以本次案例就直接上代码了. 小程序前端 index.wxml 获取头像昵称 {{userInfo.nickNam ...
- 短视频去水印微信小程序源码前端+后端 短视频微信小程序去水印解析源码
这套源码前身有很多人售卖... 我已经优化改了前端UI共享出来,未加密 未授权,可调用别人的接口和自己的接口 样板案例 支持小程序后台流量主banner广告 支持小程序后台流量主激励视频广告 支持全网 ...
- 微信小程序之图片、音频、视频上传(附前后端代码示例)
最近搞小程序开发,碰到了图片上传和音视频上传的问题,百度了下,网上示例不多,鄙人不才,就用TP3.2.3自己写了一个小程序上传图片.音视频的示例,刚好也是项目所需.能力有限,不喜勿喷,仅供新手参考. ...
- 超级抖音腾讯视频V3.6.0小程序源码 前端+后端 支持视频采集和上传
简介: 支持设置流量主代码变现 变现 跳其他小程序 公众号吸粉 3.0版本支持收费 视频功能 看多少秒费用才能继续观看, 看多少秒强制分享3个群继续观看. 看多少秒关注公众号继续观看 自带全网视频搜索 ...
最新文章
- CVPR2020最新论文扫描盘点(上)
- 利用sendEmail-v1.55转发邮件
- BZOJ4034 树上操作(树剖 线段树大模板)
- Java判断语句 循环语句
- [多级联动下拉选择框]和[Tree to Tree]续——让他们可以设置默认值
- C# WinForm 弹出模式窗口操作滚动条
- JavaScript高级程序设计20.pdf
- web ua检测_UA Web挑战会议:针对初创公司的SpringIO
- python填充_python 实现矩阵填充0的例子
- php短链接api,PHP通过调用新浪API生成t.cn格式短网址链接的方法详解
- Vue is not defined;at App onLaunch function;at api getSystemInfo success callback function
- 洛谷 1429 平面最近点对(加强版) 快排 非点分治或kdtree
- 从linux服务器上取文件,简介从Linux服务器上远程获取文件的几种方法
- WebLogic 11g重置用户密码
- 明日之后在同一个服务器找不到人,明日之后怎么跨区加好友 看这里
- 【转载】js 对表格进行各种操作(转)
- 致远OA漏洞学习——A6版本test.jsp 文件上传
- [AHK]在当前目录中运行DOS命令行--DosHere
- 忆享科技聚焦|数字中国发展报告、政务云市场规模、网络安全、中小企业数字化……近期热点资讯一览
- 王小川如愿远离周鸿祎,他说未来搜索,三分天下
热门文章
- 天猫直通车的相关定义
- 制作自己的字体图标库
- 曲线拟合合集:regress,polyfit,robust,cfun等
- 人类高质量程序员电脑配置(持续更新)
- 海森堡bug_海森堡因超速而停下来警察说,你知道你要走多快,海森堡说
- 【Unity3D日常开发】灯光系统,太阳光晕效果实现
- 电脑连上网却无法使用浏览器,显示远程计算机或设备将不接受连接的解决办法
- EasyFlash 里的 EF_WRITE_GRAN
- 计算机word入门教学ppt,word2003入门教学课件
- 南华大学计算机学院赵畅,资源环境与安全工程2020年“砥砺六十载,逐梦新时代”元旦师生联欢会顺利举办...