徒手来一个结婚邀请函小程序

首先来几个效果图

首先是我们api.js

const host = 'https://alterem.top/merry/app/'

//-----通用图片地址
const imageError = 'https://i.loli.net/2018/11/15/5bed72ab15f55.png'

//-----splash
const splashWave = 'https://i.loli.net/2018/11/15/5bed73aa3b5a4.png'
const indexHead = 'http://thirdwx.qlogo.cn/mmopen/ppcKM4gvHZIeXrlWyUMScWPcuicpODTkhh9kV5ic8c99UsAoxXsOGyibPq6OGCDibRtbBGPh42Aicc5sQ40F9jEK1EiaAxpG1h3Fjb/132'
const splashLoading = 'https://i.loli.net/2018/11/15/5bed7455aeac8.gif'

//---- 背景音乐
const musicLinkTitle = 'merryMe'
const musicLink = ''
//---- 经纬度
const lng = 111.315370
const lat = 29.744200
const locName = 'xx & xx'
const locAddress = '湖南省xxxxxxxxx村'
const shareTitle = '诚意邀请您参加我们的婚礼'
const sharePath = 'pages/splash/splash'

//-----home

//-----my

//-----

module.exports = {
  // image,
  host, 
  //mobileIn,
  imageError,
  splashWave, indexHead,
  splashLoading, musicLinkTitle, musicLink,
  lng, lat, locName, locAddress,
  shareTitle, sharePath
}

其中定义了我们后台服务器的地址（因为要用到留言等功能）还有一些乱七八糟的常量，包括经纬度，背景音乐等信息

然后是我们的splash页面：

js

var api = require('../../api/api.js')
//获取应用实例
var app = getApp()

Page({
  data: {
    remind: '加载中',
    help_status: false,
    userid_focus: false,
    passwd_focus: false,
    userid: '',
    passwd: '',
    angle: 0
  },
  onLoad: function () {
    var that = this
    that.setData({
      wave: api.splashWave,
      index_head: api.indexHead,
      loading: api.splashLoading
    })
    app.getUserInfo(function (userInfo) {
      that.setData({
        userInfo: userInfo
      })
    })
  },
  onReady: function () {
    var _this = this;
    setTimeout(function () {
      _this.setData({
        remind: ''
      });
    }, 1000);
    wx.onAccelerometerChange(function (res) {
      var angle = -(res.x * 30).toFixed(1);
      if (angle > 14) { angle = 14; }
      else if (angle < -14) { angle = -14; }
      if (_this.data.angle !== angle) {
        _this.setData({
          angle: angle
        });
      }
    });
  },
  btnEnter:function(){
    this.goHome()
  },
  goHome: function () {
    wx.switchTab({
      url: '../home/home'
    });
  },
  getUserInfo(e) {
    if (e.detail.errMsg === 'getUserInfo:ok') {
      wx.showLoading({
        title: '加载中...',
      })
      app.globalData.userInfo = e.detail.rawData
    } else {
      wx.showModal({
        title: '提示',
        content: '获取用户信息失败',
        showCancel: false,
        confirmColor: '#e2211c',
        success(res) {

        }
      })
    }
  },
  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {
    var that = this;
    return {
      title: api.shareTitle,
      path: api.sharePath,
      success: function (res) {
        wx.showToast({
          title: '分享成功',
        })
      },
      fail: function (res) {
        // 转发失败
        wx.showToast({
          title: '分享取消',
        })
      }
    }
  }
})

wxml

<view class="container">
  <view class="remind-box" wx:if="{{remind}}">
    <image class="remind-img" src="{{loading}}"></image>
  </view>
  <block wx:else>
    <text class="title">We are getting married!</text>
    <view class="content">
      <view class="hd" style="transform:rotateZ({{angle}}deg);">
        <image class="logo" src="{{index_head}}"></image>
        <image class="wave" src="{{wave}}" mode="aspectFill"></image>
        <image class="wave wave-bg" src="{{wave}}" mode="aspectFill"></image>
      </view>
      <!-- <view class="index_txt">
          您好:{{userInfo.nickName}}
      </view> -->
      <button class="confirm-btn" open-type='getUserInfo' bindgetuserinfo='getUserInfo' bindtap="btnEnter">进入</button>
    </view>
  </block>
</view>

然后进入到我们的home页面

js

var api = require('../../api/api.js')
const app = getApp()
var imgPlus = [
  'https://res.fc.fjqyx.com/f9ef8dcc94a040a3a5d5c4b400618fe5',
  'https://res.fc.fjqyx.com/8490e7295b5841478faf5ae021c516b4',
  'https://res.fc.fjqyx.com/f3297e4bb2b0484a8bb2c8659b3ed97f',
  'https://res.fc.fjqyx.com/044e13ca379a433a909f8593865bfe7d',
  'https://res.fc.fjqyx.com/e2dd808030914463bf422d40dc9800b3',
  'https://res.fc.fjqyx.com/b44c98e34971497b94ae3212cf5bb019',
  'https://res.fc.fjqyx.com/3493c7bf430d48099ecf87026c33344b',
  'https://res.fc.fjqyx.com/3c0e448fda6848d6b40ae4072263d96e',
  'https://res.fc.fjqyx.com/20b9227ce4d641f79a2fbdc7529c7d2c',
  'https://res.fc.fjqyx.com/c68f4f7e50f0466b904e1d32f3153581',
  'https://res.fc.fjqyx.com/c92224ac2ad5415781a12930345fc51e',
  'https://res.fc.fjqyx.com/5f314291f70e4453b5f2d221d9242fed',
  'https://res.fc.fjqyx.com/3fd5ce7faeb14741a9a51b0cca4f412d',
  'https://res.fc.fjqyx.com/ec06d58eaa9a4242a21e352727b9bb92',
  'https://res.fc.fjqyx.com/62f50284ffd849bc8163dda975564c93',
  'https://res.fc.fjqyx.com/904334756e704b689e85151133133e98',
  'https://res.fc.fjqyx.com/bb89ed7d8bfa4f48a068a4e7c07aa4e1',
  'https://res.fc.fjqyx.com/692592ba583742559526c7315774de25',
  'https://res.fc.fjqyx.com/cbf199e107854eec93d78b80324a1212',
  'https://res.fc.fjqyx.com/5b4aa0b786374474ada9665a307eaabd',
  'https://res.fc.fjqyx.com/6a03e1e4eff74d1faac6496acd51e9dd',
  'https://res.fc.fjqyx.com/60a78fd463e540dba2e05ac5a8c86edf',
  'https://res.fc.fjqyx.com/de9c0b6239f648b4aa98247ea774bec1',
  'https://res.fc.fjqyx.com/381b87ba5a6f4321a4cfda24fe8b1a38',
  'https://res.fc.fjqyx.com/31f6b825a7174d1383c165c33f789b1a',
  'https://res.fc.fjqyx.com/d1e3d6fd2c2243faa8e47a91278add1a',
  'https://res.fc.fjqyx.com/c9d3b2ad821741568b5f2ea073f32207',
  'https://res.fc.fjqyx.com/1d8f52b1bb1440d78ec5bfa97ce78978',
  'https://res.fc.fjqyx.com/008a945e747b43cbac08337b212296f2',
  'https://res.fc.fjqyx.com/3fe58341a86643d7b79411b9248321e2',
  'https://res.fc.fjqyx.com/9ad8559912a0494fb6b45dabf2f531e1',
  'https://res.fc.fjqyx.com/0f7d2442184b4fa1bb66846a6e205061',
  'https://res.fc.fjqyx.com/c460fc394ce14a8ebf93417f44577005',
  'https://res.fc.fjqyx.com/ff84aadaf2904e319bc6dc0f53d7d15f',

  'https://res.fc.fjqyx.com/bf77d2c2c5a94bf4a5570c23d2095aa8',
  'https://res.fc.fjqyx.com/ede34987ccd847fe8f0cb3406664041e',
  'https://res.fc.fjqyx.com/bf687f43256442b2bcd046102663e9e7',
  'https://res.fc.fjqyx.com/b843d5e37d8c4c07b9b431043a0b9422',
  'https://res.fc.fjqyx.com/140d702826fe443282c43287804861a7',
  'https://res.fc.fjqyx.com/d1aeb0949e6b4f96a8b4d6c4a5f6a8a9',
  'https://res.fc.fjqyx.com/04470b502dfa48e39119b9dea5ca334c',
  'https://res.fc.fjqyx.com/7d92b71316e64eb0a34d475e15a3281f',
  'https://res.fc.fjqyx.com/e28f44f53e224556846b037579e0d1a3',
  'https://res.fc.fjqyx.com/52c8eec539a644daad5c5d0bd54d4c5f',
  'https://res.fc.fjqyx.com/335647c20be64c39814bffa4a340e693',
  'https://res.fc.fjqyx.com/aff6a867f9904272a3f7dbb9bffacbb0',
  'https://res.fc.fjqyx.com/243b18ff952547beae5962256167ba61'
]
//数据可用接口返回 - 在此展示只是为了方便查看数据体
Page({
  data: {
    imgUrls: [
      { imgUrl: 'https://res.fc.fjqyx.com/f9ef8dcc94a040a3a5d5c4b400618fe5', desc: '我能达到最大的成就，就是每天早上睁开眼看见的人是你' },
      { imgUrl: 'https://res.fc.fjqyx.com/8490e7295b5841478faf5ae021c516b4', desc: '听悲伤的歌,看幸福的戏' },
      { imgUrl: 'https://res.fc.fjqyx.com/f3297e4bb2b0484a8bb2c8659b3ed97f', desc: '若不相见，则不相欠' },
      { imgUrl: 'https://res.fc.fjqyx.com/044e13ca379a433a909f8593865bfe7d', desc: '就算世界荒芜，也有一个人会是你的信徒' },
      { imgUrl: 'https://res.fc.fjqyx.com/e2dd808030914463bf422d40dc9800b3', desc: '自有佳人予良辰，陪你笑辞别往生' },
      { imgUrl: 'https://res.fc.fjqyx.com/b44c98e34971497b94ae3212cf5bb019', desc: '正是人间少年风范，何妨挑灯奋于夜半' },
      { imgUrl: 'https://res.fc.fjqyx.com/3493c7bf430d48099ecf87026c33344b', desc: '飞蛾扑火时，一定是极快乐幸福的' },
      { imgUrl: 'https://res.fc.fjqyx.com/3c0e448fda6848d6b40ae4072263d96e', desc: '无论是短短的几日，长长的一生，哭、笑、爱、恨，梦里梦外，颠颠倒倒，竟都有它消失的一日' },
      { imgUrl: 'https://res.fc.fjqyx.com/20b9227ce4d641f79a2fbdc7529c7d2c', desc: '人生就是如此，你以为已经从一个漩涡逃离，其实另外一个漩涡就在你的脚下。用力蹬一脚，就进去了。所以，不需要对生活太用力，心会带着我们去该去的地方...' },
      { imgUrl: 'https://res.fc.fjqyx.com/c68f4f7e50f0466b904e1d32f3153581', desc: '我愿意深深地扎入生活，吮尽生活的骨髓，过得扎实，简单，把一切不属于生活的内容剔除得干净利落，把生活逼到绝处，用最基本的形式，简单，简单，再简单' },
      { imgUrl: 'https://res.fc.fjqyx.com/c92224ac2ad5415781a12930345fc51e', desc: '太阳未出时，全世界都像一个梦，唯有月亮是真实的；太阳出来后，全世界都真实了，唯有月亮像一个梦' },
      { imgUrl: 'https://res.fc.fjqyx.com/5f314291f70e4453b5f2d221d9242fed', desc: '人生苦短，不如不管，继续任性' },
      { imgUrl: 'https://res.fc.fjqyx.com/3fd5ce7faeb14741a9a51b0cca4f412d', desc: '若然幸福要付出代价 只要舍得也就值了 我只知道 他人的蜂蜜有时是自己的砒霜 模拟他人的幸福 才折了自己的福 ' },
      { imgUrl: 'https://res.fc.fjqyx.com/ec06d58eaa9a4242a21e352727b9bb92', desc: '你的影子，覆盖了我的天空 我那么想你，想到几乎忘记了是为什么想你。在我努力克制的悲伤深处，在我不可抑止的思念深处，你总会云淡风轻...' },
      { imgUrl: 'https://res.fc.fjqyx.com/62f50284ffd849bc8163dda975564c93', desc: '许多年之后你再看，骑快马飞奔的人和坐在牛背上慢悠悠赶路的人，一样老态龙钟回到村庄里，他们衰老的速度是一样的。时间才不管谁跑得多快多慢呢' },
      { imgUrl: 'https://res.fc.fjqyx.com/904334756e704b689e85151133133e98', desc: '年轻人不依赖批判和负面的东西而生活 他们靠感情和理想' },
      { imgUrl: 'https://res.fc.fjqyx.com/bb89ed7d8bfa4f48a068a4e7c07aa4e1', desc: '虔诚者将世界神话化，又经常不将它当一回事。他总是那么倾向于游戏人间' },
      { imgUrl: 'https://res.fc.fjqyx.com/692592ba583742559526c7315774de25', desc: '如果能忘掉时间、不自我定位、不假思索、把许多定义和概念抛开的话，应该会幸福很多' },
      { imgUrl: 'https://res.fc.fjqyx.com/cbf199e107854eec93d78b80324a1212', desc: '我的生活全部沉浸在“时间”的急流中，跟了它流下去，没有抬起头来望望这急流的前后的光景的能力' },
      { imgUrl: 'https://res.fc.fjqyx.com/5b4aa0b786374474ada9665a307eaabd', desc: '巴黎的雨下个不停，你终于懂了那是你们回不去的从前，雨停了，你要往前走，就像塞纳河一样' },
      { imgUrl: 'https://res.fc.fjqyx.com/6a03e1e4eff74d1faac6496acd51e9dd', desc: '拥抱的感觉真好，那是肉体的安慰，尘世的奖赏' },
      { imgUrl: 'https://res.fc.fjqyx.com/60a78fd463e540dba2e05ac5a8c86edf', desc: '女人敢走，是看准了男人会回头。 男人头也不回，是看准了女人不敢走' },
      { imgUrl: 'https://res.fc.fjqyx.com/de9c0b6239f648b4aa98247ea774bec1', desc: '不谦而狂的人，狂不到哪里去；不狂而谦的人，真不知其在谦什么' },
      { imgUrl: 'https://res.fc.fjqyx.com/381b87ba5a6f4321a4cfda24fe8b1a38', desc: '谁的眼角触得了谁的眉 ； 谁的笑容抵得了谁的泪 ； 谁的心脏载得住谁的轮回 ； 谁的掌纹赎得回谁的罪' },
      { imgUrl: 'https://res.fc.fjqyx.com/31f6b825a7174d1383c165c33f789b1a', desc: '许多地方没有功德水，那是因为当地的人没有功德了。一个地方的水开始污染，表示人心已先污染了' },
      { imgUrl: 'https://res.fc.fjqyx.com/d1e3d6fd2c2243faa8e47a91278add1a', desc: '即使含着泪， 低着眉， 伤心地笑着， 也总要与一些久别的故人， 相见欢' },
      { imgUrl: 'https://res.fc.fjqyx.com/c9d3b2ad821741568b5f2ea073f32207', desc: '如果一切生命都不屑于去石缝间寻求立足的天地，那么，世界上将会有一大片地方成为永远的死寂' },
      { imgUrl: 'https://res.fc.fjqyx.com/1d8f52b1bb1440d78ec5bfa97ce78978', desc: '那时脑子太灵光了，如同上了油的齿轮，一秒钟不知要转多少圈，智慧弥漫在四周的空气里，伸手一抓就是一大把' },
      { imgUrl: 'https://res.fc.fjqyx.com/008a945e747b43cbac08337b212296f2', desc: '可自从我意识到我自己，我就感知到，我的自我中存在着天生渴望神秘的倾向，渴望艺术化地说谎' },
      { imgUrl: 'https://res.fc.fjqyx.com/3fe58341a86643d7b79411b9248321e2', desc: '来吧！让暴风雨来得更猛烈一些吧' },
      { imgUrl: 'https://res.fc.fjqyx.com/9ad8559912a0494fb6b45dabf2f531e1', desc: '离去，让事情变得简单，人们变得善良，像个孩子一样，我们重新开始' },
      { imgUrl: 'https://res.fc.fjqyx.com/0f7d2442184b4fa1bb66846a6e205061', desc: '你有情有义，我必不负你赤诚真心' },
      { imgUrl: 'https://res.fc.fjqyx.com/c460fc394ce14a8ebf93417f44577005', desc: '我们曾如此渴望命运的波澜，到最后才发现：人生最曼妙的风景，竟是内心的淡定与从容' },
      { imgUrl: 'https://res.fc.fjqyx.com/ff84aadaf2904e319bc6dc0f53d7d15f', desc: '一个人在家看电视并不算寂寞，苍白地坐在话不投机人群之中，才真正凄清' }
    
    ],
    indicatorDots: true,
    interval: 2600,
    duration: 1200,
    userInfo: {}
  },
  // 预览图片
  previewImage: function (e) {
    wx.previewImage({
      current: e.target.dataset.src,
      urls: imgPlus
    })
  },
  //生命周期函数--监听页面加载
  onLoad: function() {
    var that = this
    wx.playBackgroundAudio({
      dataUrl: api.musicLink,
      title: api.musicLinkTitle,
      coverImgUrl: ''
    }),
    that.getWxUserInfo()

  },
  getWxUserInfo: function(){
    var that = this
    wx.getUserInfo({
      success: function (res) {

      }
    })
  },
  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function() {
    var that = this
    //that.getImageList()

  },
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function() {
    wx.navigateBack({
      delta: -1
    })
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function() {

  },
  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {
    var that = this;
    return {
      title: api.shareTitle,
      path: api.sharePath,
      success: function (res) {
        wx.showToast({
          title: '分享成功',
        })
      },
      fail: function (res) {
        // 转发失败
        wx.showToast({
          title: '分享取消',
        })
      }
    }
  }
})

js中定义了当前页面需要用到的图片数组以及一些文案描述等

wxml

<view class="container">
  <scroll-view class="content" scroll-y="true">
    <video src="https://res.fc.fjqyx.com/328b3c8e85c04a5da372598ffc6ef82d" style='width:100%;' autoplay="true" loop="false"></video>

    <view class='view_bg'>
      <view wx:for="{{imgUrls}}" wx:key="{{index}}">
        <view class="img">
          <image bindtap="previewImage" data-src="{{item.imgUrl}}" mode="aspectFill" class='image_style' src='{{item.imgUrl}}'></image>
        </view>
        <view class='text'>
          <text class='details'>{{item.desc}}</text>
        </view>
      </view>
    </view>
  </scroll-view>
</view>

渲染js中的图片数组到页面，然后提供图片preview功能

然后map（导航）页面

var api = require('../../api/api.js')
const app = getApp()
Page({
  data: {
  },
  regionchange(e) {
    
  },
  markertap(e) {
    wx.openLocation({
      latitude: api.lat,
      longitude: api.lng,
      scale: 18,
      name: api.locName,
      address: api.locAddress
    })
  },
  controltap(e) {

  },
  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {
    var that = this;
    return {
      title: api.shareTitle,
      path: api.sharePath,
      success: function (res) {
        wx.showToast({
          title: '分享成功',
        })
      },
      fail: function (res) {
        // 转发失败
        wx.showToast({
          title: '分享取消',
        })
      }
    }
  }
})

主要是从api中拿到经纬度，然后提供导航

wxml

<!--pages/invitation/index.wxml-->

<view class="container">
    <image src='https://res.fc.fjqyx.com/c9d3b2ad821741568b5f2ea073f32207' class='cover' mode='aspectFill'></image>
    <view class='datetime' animation="{{animationData}}">
        <view class='box'>
            <view class="name css13610f7ae66601">
                <span class="fl">xxx</span>
                <span class="and">&</span>
                <span class="fr ">xx</span>
            </view>
            <view class="date css13610f7ae66601">
                <view>谨定于 2020年10月1日</view>
                <view>农历 xxxxxx 举办婚礼</view>
                <view bindtap="markertap">地址：湖南省xxxxxxxxxx村<br />(点击导航)</view>
                <view>恭请您的光临</view>
            </view>
        </view>
    </view>
</view>

地址绑定了markertap，点击即可跳转到当前位置到目的地的导航功能

然后就是 好友祝福 页面

// pages/bless/index.js
var api = require('../../api/api.js')
const app = getApp()
Page({

  /**
   * 页面的初始数据
   */
  data: {
    userInfo: {},
    inputValue: '',
    zanNum: 0
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    var that = this

    wx.getUserInfo({
      success: function (res) {
        that.setData({
          userInfo: res.userInfo
        })
      }
    }),
    that.getPraiseList(),
    
    that.getCommentList()
    
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },
  bindKeyInput: function (e) {
    this.setData({
      inputValue: e.detail.value
    })
  },
  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
    var that = this;
    that.getPraiseList(),
    that.getCommentList()
  },
  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },
  // 获取评论列表
  getCommentList: function () {
    var that = this
    wx.request({
      url: api.host + "commentListByYun",
      method: 'POST',
      data: {},
      success: res => {
        if (200 == res.statusCode && 0 == res.data.code) {
          that.setData({
            chatList: res.data.page.list
          });
        } else {
          wx.showModal({
            title: '提示',
            content: "数据错误",
            showCancel: false
          })
        }
      }
    })
  },
  // 获取赞列表
  getPraiseList: function () {
    var that = this
    wx.request({
      url: api.host + "likeListByYun",
      method: 'POST',
      data: {

      },
      success: res => {
        wx.hideToast()
        if (200 == res.statusCode && 0 == res.data.code) {
          //更新数据
          that.setData({
            zanLog: res.data.page.list
          })
        } else {
          wx.showModal({
            title: '提示',
            content: "数据错误",
            showCancel: false
          })
        }
      },
    })
  },
  loadMoreFriends: function (e) {
    wx.navigateTo({
      url: 'blessDetail/blessDetail'
    })
  },
  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {
    var that = this;
    return {
      title: api.shareTitle,
      path: api.sharePath,
      success: function (res) {
        wx.showToast({
          title: '分享成功',
        })
      },
      fail: function (res) {
        // 转发失败
        wx.showToast({
          title: '分享取消',
        })
      }
    }
  },
  like: function (event) {
    let that = this;

    let userInfo = that.data.userInfo;
    let name = userInfo.nickName;
    let face = userInfo.avatarUrl;
    wx.request({
      url: api.host + "likeByYun",
      data: { 'nickName': name, 'nickImage': face, 'openId': getApp().globalData.openId },
      method: "POST",
      dataType: "json",
      success: res => {
        if (200 == res.statusCode && 0 == res.data.code) {
          wx.showModal({
            title: '提示',
            content: "谢谢您的祝福",
            showCancel: false
          })
          that.getPraiseList()
        } else {
          if (1001 == res.data.code) {
            wx.showModal({
              title: '错误',
              content: res.data.msg + '：我们已经收到您的祝福了，谢谢！',
              showCancel: false
            })
          }
        }
      }
    })
  },
  foo: function () {
    let that = this;
    if (that.data.inputValue) {
      //留言内容不是空值

      let userInfo = that.data.userInfo;
      let name = userInfo.nickName;
      let face = userInfo.avatarUrl;
      let words = that.data.inputValue;
      wx.request({
        url: api.host + "commentByYun",
        data: { 'nickName': name, 'nickImage': face, 'comment': words, 'openId': getApp().globalData.openId },
        method: "POST",
        dataType: "json",
        success: res => {
          if (200 == res.statusCode && 0 == res.data.code) {
            wx.showModal({
              title: '提示',
              content: "谢谢您的祝福",
              showCancel: false
            })
            that.getCommentList()
          } else {
            wx.showModal({
              title: '错误',
              content: "评论错误",
              showCancel: false
            })
          }
        }
      })
    } else {
      //Catch Error
      wx.showModal({
        title: '提示',
        content: '您还没有填写内容',
        showCancel: false
      })
    }
    that.setData({
      inputValue: ''//将data的inputValue清空
    });
    return;
  }
})

进行稍微的非空判断，然后请求后端提交

wxml

<!--pages/bless/index.wxml-->
<view class="container">

  <view class="title" wx:if="{{zanLog.length > 0}}">已收到 {{zanLog.length}} 位好友的祝福</view>
  <view class="title">点击下方按钮为我们送上祝福吧</view>

  <view class="friends" wx:if="{{zanLog.length > 0}}">
    <!-- <view bindtap='loadMoreFriends' class="face" wx:for="{{zanLog}}" wx:key="user">
      <image src="{{item.face}}" />
    </view> -->
    <view bindtap='loadMoreFriends' class="face" wx:for="{{zanLog}}" wx:key="user"><image src="{{item.nickImage}}" /></view>
  </view>
  <view class="btn_zone">
    <view class="zan fl">
      <button type="primary" bindtap='like'>送上祝福</button>
    </view>
    <view class="share fr">
      <button type="default" open-type="share">分享</button>
    </view>
  </view>

  <view  class="chat_view" wx:if="{{chatList.length > 0}}">
    <view class="chat_list" wx:for="{{chatList}}" wx:key="user">
      <view class="chat_face">
        <!-- <image src="{{item.face}}" /> -->
        <image src="{{item.nickImage}}" />
      </view>
      <view class="chat_words">
        <view class="chat_meta">
          <text class="chat_user">{{item.nickName}}</text>
        </view>
        <!-- <view>{{item.words}}</view> -->
        <view>{{item.comment}}</view>
      </view>
    </view>
  </view>
  <view wx:else>
    <view class="befirst">
      <image src="/image/lovemail.gif" />
    </view>
  </view>
  <view class="send_msg" >
    <form bindreset="foo">
      <input placeholder="快写下您的祝福吧！" class="send_ipt" bindinput="bindKeyInput" cursor-spacing='100' />
      <button type="primary" form-type="reset" class="send_btn">发送</button>
    </form>
  </view>
</view>

代码很简单，没有很复杂的实现，

最后奉上体验地址：