这篇文章主要为大家详细介绍了微信小程序实现留言板，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

本文实例为大家分享了小程序实现留言板的具体代码，供大家参考，具体内容如下

wxml

 view 
 textarea type='text' placeholder="请选择或者输入捎话(60字以内)" maxlength='80' onfocus="this.blur()" bindtap='' /textarea 
 /view 
 view 快速捎话：{{neirong}} /view 
 view wx:for="{{msgData}}" wx:key="{{index}}" 
 view /view 
 text data-nr='{{item.msg}}' bindtap='clickMe' {{item.msg}} /text 
 /view 
 button 捎话 /button 

index.js

var nr = '';
Page({
 * 页面的初始数据
 data: {
 msgData:
 msg:
 "泡澡水不要太热。"
 },//双引号
 msg:
 "面部比较干，想补个水。"
 msg:
 "我只有2小时，您看着安排吧。"
 msg:
 "我想把眉毛在修下。"
 msg:
 "给我清个痘痘。"
 msg:
 "头疼，能轻点按。"
 neirong: '',
 clickMe: function (e) {
 var that = this;
 console.log(e);
 nr = e.currentTarget.dataset.nr;
 that.setData({
 neirong: nr
 * 生命周期函数--监听页面加载
 onLoad: function (options) {
 * 生命周期函数--监听页面初次渲染完成
 onReady: function () {
 * 生命周期函数--监听页面显示
 onShow: function () {
 * 生命周期函数--监听页面隐藏
 onHide: function () {
 * 生命周期函数--监听页面卸载
 onUnload: function () {
 * 页面相关事件处理函数--监听用户下拉动作
 onPullDownRefresh: function () {
 * 页面上拉触底事件的处理函数
 onReachBottom: function () {
 * 用户点击右上角分享
 onShareAppMessage: function () {

wx.css

/*捎话wx.css */
.section{
width:96%;
height:220rpx;
margin-left:5px;
.message1{
 width:96%;
 height:210rpx;
 margin-top: 30rpx;
 font-size: 90%;
 margin-left:20px;
.circle{
 height:35rpx;
 width:35rpx;
 border-radius: 50%;
 border: 1px solid #ccc;
 display:inline-block;
 margin:28rpx 45rpx auto 50rpx;
.fast{
 position:relative;
 top:-50rpx;
 font-size:90%;
 background:#f4f4f4;
 line-height:100rpx;
 text-indent:2em;
.item{
position:relative;
border-bottom:1px solid #f4f4f4;
padding-bottom:10px;
top: -60rpx;
.message_font{
 font-size:80%;
 font-family:"微软雅黑";
 font-weight:blod;
 display:inline-block;
 position:relative;
 top:-5rpx;
.submit{
 width:100%;
 height: 100rpx;
 background: #fed1d6;
 position: relative;
 top:168rpx;
 line-height: 100rpx;
button::after{
 border:none;

但是上面的textarea还可以自由去编写，但是想实现在快速留言后面，再添加内容

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持凡科。