实现一个输入框和一个提交按钮

实现一个输入框和一个提交按钮。点击提交按钮时,如果云数据库中没有数据,则将当前输入框内容上传。如果云数据库中有数据,则在
界面中显示"不要重复输入“

提示∶在判断能否上传时,你需要先读取数据库内容,再向数据库上传。实际上要做到这样的连续行为,需要在完成第一个行为的sucess回调函数中执行第二个行为。若不这样操作,则不能保证执行的先后顺序,会产生意外的结果。

之前写的一个示例,题主参考下
###demo.wxml

<view style="padding:10px">
  <form bindsubmit="saveToCloudDb">
    <input name="text" style="border:solid 1px #ccc;padding:5px;margin-bottom:10px" placeholder="请输入输入内容" />
    <button type="primary" form-type="submit">提交</button>
</form>
</view>
 

###demo.js,注意修改云数据库环境id

wx.cloud.init({env: '题主云数据库环境id'});
const db = wx.cloud.database();
Page({
  saveToCloudDb(e){
    var text=e.detail.value.text.trim();
    if(text!=""){
      //获取test集合,查找集合中text字段值等于输入值的记录,如果字段名称不是text,改为.where({xxxx:text}),xxx为字段名称
      db.collection('test').where({text}).get({
        success(res){
          if(res.data.length==0){//不存在保存记录,字段名称为text,其他修改data:{xxxx:text}
            db.collection('test').add({data:{text}}).then(e=>{
              wx.showToast({title: '保存成功'});
            }).catch((e)=>{
              wx.showToast({title: '保存失败',icon:'none'});
              console.log(e)
            });
          }
          else wx.showToast({title: '不要重复输入',icon:'none'});
        }
      })
    }
   }
})
 
 

获取云端的数据存在是否有内容,没有就上传,否则就给出对应提示。

// pages/test/test.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    desc: null,
    hidden: true,
  },
  onDescInput(e) {
    this.setData({
      desc: e.detail.value
    })
  },
  onUpload() {
    const db = wx.cloud.database()
    db.collection('todo').where({
        desc: this.data.desc
      })
      .get()
      .then(res => {
        console.log(res)
        if (res.data.length > 0) {
          this.setData({
            hidden: false
          })
        } else {
          db.collection('todo').add({
            data: {
              desc: this.data.desc
            }
          }).then(console.log).catch(console.log)
        }
      })
      .catch(console.log)
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {

  },

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

  },

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

  },

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

  },

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

  },

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

  },

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

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})
<!--pages/test/test.wxml-->
<view>
<input bindinput="onDescInput" value="{{desc}}" placeholder="请输入"/>
<button bindtap="onUpload">上传</button>
<view wx:if="{{!hidden}}">已存在</view>
</view>
您好,我是有问必答小助手,您的问题已经有小伙伴帮您解答,感谢您对有问必答的支持与关注!
PS:问答VIP年卡 【限时加赠:IT技术图书免费领】,了解详情>>> https://vip.csdn.net/askvip?utm_source=1146287632