- 小程序云开发学习笔记2
上一个笔记记录了如何用云开发函数实现数据的查找和增加,今天就继续用我之前的例子来实现商品的更新和删除操作吧。 首先是更新操作,为了方便起见,先只更新下书本的价格,在前端设置输入框和点击事件,js获取输入的内容,然后按钮点击事件调用云开发函数进行数据更新。 [图片] 实现修改数据的方法写在点击事件对应的函数里: [图片] 然后就是测试是不是能根据输入修改价格,但发现弹出提示“更新成功”,但价格那一栏的数据并没有更新,既然显示”更新成功”,那么操作数据的权限肯定是没有问题的,我也实时用this.getDatail()刷新了数据,为了数据没有更新? 经过查找,原来在数据库用手动方式添加的数据,本身不携带字段_openid,没有_openid字段的数据无法更新通过这种简单的方式更新数据: [图片] 这里貌似需要用到云函数的相关知识,这里如果要实现更新,只能给数据自己加上一个字段_openid。而如果通过wx.cloud.database.collection(“表名”).add添加的数据,默认会携带添加数据时的_openid,因此,可以对数据进行修改。这可能是微信处于安全方面的考虑吧,也就是说用户只能修改自己创建的数据,而不用轻易修改开发者创建的数据。 然后是删除操作,首先是简单的页面: [图片] 依然是button点击事件进行触发,这里删除操作是有风险的,一般建议不删除,即使要删除,也可以设置一个“deletestatus”字段,删除时将字段值由0设置为1,因为数据一旦删除就没有了,而不知道什么时候又能用到,尤其是诸如订单、查询历史这些信息。当然这里还是直接删除,用wx.showmodel()弹出确认框,接下来是删除操作的函数: [图片] 然鹅,点击确认删除后,事情没有想象地那么简单,系统弹出警告: [图片] 权限我已经打开,既然又是无法删除,会不会又是_openid没有所导致的?于是我通过wx.cloud.database.collection(“表名”).add添加数据,这样该条数据会默认携带我的openid,然后点击删除这条数据,显示成功: [图片] 这么看来,数据有无_openid在更新和删除权限上是有区别的,一般我们添加数据也是管理员或者用户添加,会生成_openid字段,这样才有更新和删除的权限。当然,我觉得没有_openid的字段应该也可以有权限更新删除,可以继续学习学习。这点和传统后端有点不同,传统后端倒是没有太多权限方面的考虑(有可能是我没涉及到),而且后端查询异常需要自己捕获和处理,小程序这边自己帮我们很好的进行了处理。 下面是最基本的增删改查操作的汇总: //查询操作 wx.cloud.database().collection("表名") .doc("数据对应的_id") //查询单条记录时可以用_id绑定 .where({ //需要条件查询可以添加where 字段名:值 }) .get() .then(res=>{ //成功之后的处理 }) .catch(err=>{ //失败后的处理 }) //增加操作 wx.cloud.database().collection("表名") .add({ data:{ 字段名:值 //这里来设置数据各字段的值 } }) .then(res=>{ //成功之后的处理 }) .catch(err=>{ //失败后的处理 }) //更新操作 wx.cloud.database().collection("表名") .doc("数据对应的_id") //查询单条记录时可以用_id绑定 .update({ data:{ 字段名:值 //这里来设置需要更新的字段的值 } }) .then(res=>{ //成功之后的处理 }) .catch(err=>{ //失败后的处理 }) //删除操作 wx.cloud.database().collection("表名") .doc("数据对应的_id") //删除单条记录时可以用_id绑定 .remove() .then(res=>{ //成功之后的处理 }) .catch(err=>{ //失败后的处理 }) 进行微信小程序云开发,你几乎不需要对传统的数据库操作语句进行了解,就可以轻松上手,对于编程小白和非计算机专业的学生比较友好,当然,如果学习了数据库知识,再对比云开发,肯定能加深对数据库的理解。
2021-11-11 - 小程序云开发学习笔记1
本人做过一点微信小程序的项目,但主要是负责Java Springboot的后端开发,平时很少接触过小程序前端和云开发,听说云开发要比服务器后端方便很多。我就分享一下我学习云开发的心得,并且做一下云开发和后端服务器的比较。 传统的服务器后端开发需要买服务器,买域名,本身就很消瘦的钱包更是雪上加霜,但还要进行恼人的环境配置,还要熟悉一些Linux指令,对于小白来说简直是噩梦。但云开发只需要获取环境ID,就可以在app.js里面设置,如下图:省去了很多麻烦。 [图片] 值得注意的是,小程序云开发需要设置数据权限才能访问数据,但是设置起来也是极其简单,只需要简单地点击即可: [图片] 今天实现一下小程序通过云数据库实现查询和添加功能,首先是前端的一些wxml代码,主要实现一下书本列表和书本详情页面: 书本列表页面: <view class='list'> <block wx:for='{{bookList}}' wx:key='list' wx:for-item="item"> <view bindtap="getDetail" data-id="{{item._id}}" class="list_item"> <view class='info'> <view class='title'>{{item.name}}</view> <view class='price'>¥{{item.price}}</view> </view> <view class='clear'></view> </view> </block> <input placeholder="请输入商品名" bindinput="getName"/> <input placeholder="请输入价格" bindinput="getPrice"/> <input placeholder="请输入介绍" bindinput="getIntroduction"/> <button class="btn" bindtap="addBook">添加书本</button> </view> 书本详情页面: <view class="name">书本名:{{detail.name}}</view> <view class="price">价格:¥{{detail.price}}</view> <view class="introduction"> 介绍: <view class="content"> {{detail.introduction}} </view> </view> 然后就是书本信息的获取,这里需要获取全部信息和单条信息,获取全部信息的代码下: 注意database后面需要有括号,并且.then和.catch由于是类lambda表达式,this所指向的内容默认为父类Page,所以不需要将Page的data通过var that=this的形式重新赋值。 [图片] 获取的信息在前端进行渲染,最后形成如下的列表,当然数据表可以先在数据库里面手动创建,微信小程序的数据库更像键值对,而不是传统后端意义上的索引表,所以显示数据时给人更加直观的感觉。 [图片] 这是全部查询,如果我们只想要查询一条数据,可以写如下的代码: 注意doc后面的括号内必须是数据的id号,微信小程序云开发会为我们自动生成一个主键,主键就是区分数据的标识,无需我们自动设置,这个标识存在表中,名字为_id,可以通过这个id获取特定的单个数据。 [图片] 这里我通过查询单个数据返回一本书的详细信息,展示在页面中: [图片] 最后就是商品的添加操作,首先需要前端<input>和<button>组件实现数据的写入,然后js读取数据,最后调用云函数: [图片][图片] 但是,要注意的是,如上文所说,操作数据是有权限的,我们原先由于权限的问题,无法添加数据,如果一定要添加,就会报如图所示的错误: 意思是权限不够,所以,我们需要修改权限: [图片] [图片] 最后,还有一点需要注意,我们添加数据有两种,第一种就是在数据库表中手动添加,第二种就是在js中调用wx.cloud.database.collection(“表名”).add添加,这两种在传统后台服务器没有区别,但是在小程序中,第一种方式添加的数据,不会有_openid字段,但第二种方式添加的数据,会有_openid字段,标识改数据是某个openid对应的用户添加的。这点与后面修改数据时的权限有关,大家需要注意。
2021-11-10