小程序基础介绍

摘要:
强制性的填充页面后,默认情况下会生成页面目录结构。主页的第一段读取页面以定义@2和窗口字段,这些字段定义小程序所有页面的顶部背景色和文本颜色定义。

1.app.json

小程序的全局配置,包括了小程序的所有页面路径、界面表现、网络超时时间、底部 tab 等

@1、pages字段 —— 用于描述当前小程序所有页面路径,这是为了让微信客户端知道当前你的小程序页面定义在哪个目录。必填,pages填写之后默认生成page目录结构,首页读pages第一段定义

@2、window字段 —— 定义小程序所有页面的顶部背景颜色,文字颜色定义等。

@3、tabBar底部tab栏表现 object

@4、networkTimeout 网络超时时间 object

@5、debug 是否开启debug boolean

@6、functionalPages 是否开启插件功能页,默认关闭 boolean

@7、subpackages 分包结构配制 sobject

@8、workers worker代码存放目录 string

@9、requireBackgroundModes 需要后台使用的能力 string

@10、plugins 使用到的插件 Object

@11、resizable ipad小程序是否支持屏幕旋转 Boolean 默认关闭

@12、navaigateToMiniProgramAppIdList 需要跳转小程序列表 string

@13、permission 小程序权限相关设置 object

@14、sitemapLocation 指明sitemap.json的位置 必填

2、跳转链接

wx.navigateto  跳转链接保留当前上一个页面,例如a页面跳转B页面A页面被保留B页面跳转C页面AB页面保留,C页面点击返回上一页到B页面,B页面点击返回到A页面

wx.redirectTo 销毁当前页面跳转到新的页面 A页面跳转B页面,A页面被销毁并跳转至B页面此时,返回不能返回A页面只会返回小程序首页

3、rpx

rpx(responsive pixel): 可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在 iPhone6 上,屏幕宽度为375px,共有750个物理像素,则750rpx = 375px = 750物理像素,1rpx = 0.5px = 1物理像素。

4、弹性布局

参考链接https://blog.csdn.net/weixin_39717076/article/details/82586915

 display:flex;flex-wrap:wrap;justify-content:space-between; 弹性布局,自动换行,两端对齐

5、云开发

云开发的云函数注册在project.config.json,定义模式为“cloudfunctionRoot”:"路径地址" 云函数根路径

云函数分为核心三大块

1)数据库 数据库创建集合,集合相当于数据库中的数据表

2)存储   可以理解为网络云盘,相当于cms系统中的文件保存的地方,简单点说就是存放文件,可以通过网络路径去下载去访问的一个云端存储

3)云函数  项目中逻辑代码

6、云函数

1)app.js-->onlaunch     wx.cloud.init({traceUser:true}) 初始化云函数

2)app.js-->onlaunch 使用云函数 

wx.clound.callFunction({
  //云函数名为文件夹名字 name:'xxx云函数名', data:{ }, success(res){ //成功回调 } })

7、连接数据库API

const cloud = require('wx-server-sdk')
cloud.init()
const db = cloud.database()  

8、连接到数据表

const cloud = require('wx-server-sdk')
cloud.init()
const db = cloud.database()
const todosCollection = db.collection('todos')

9、查询

let db=cloud.database();
db.collection("集合名").get().then(res=>
   console.log(res)
})
//查询到集合的所有信息 

db.collection("集合名").where({ age:18 }).get().then(res=>{ })//查询where条件为age18的数据

db.collection("集合名").where({
  age:18
}).orderBy(
  "age","desc"
).get().then(res=>{
})//查询where条件为age=18,并倒序排序

db.collection("集合名").where({
  age:18
}).orderBy("age","desc").limit(2).get().then(res=>{

})//查询where条件为age=18 并用倒序排序的 两条数据


db.collection("集合名").where({

  age:18
}).orderBy("age","desc").skip(10).limit(2).get.then(res=>{

})//查询where 条件为age=18 age倒序排序,每页10条数据 取第二页的数据skip不能为0

db.collection("集合名").where({
  age:18
}).orderBy("age","desc").skip(10).limit(2).field({
  name:true,
  age:true
}).get().then(res=>{

})
//查询where 条件为age=18 age倒序排序,每页10条数据 取第二页的数据,只获取name字段和age字段

db.collection("集合名").where({
  age:18
}).count().then(res=>{
  console.log(res.total)
})//查询条件为age=18在集合中有多少个

let _=db.command;
db.collection("集合名").whree({
  age:_.in({18,19})
}).get().then(res=>{

})//查询age为18,19的数据,db.command为构造查询条件,有比大小之类得到方法

https://developers.weixin.qq.com/miniprogram/dev/wxcloud/reference-server-api/database/#command

db.collection("集合名").whree(
  _.or([
  {age:_.in(18,19)},
  {name:melon}
])
).get().then(res=>{

})//查询age为18,19或名字为melon的所有数据
 

10、更新数据

let db=cloud.database();

return await da.collection("集合名").where({
   id:xxx 
}).updata({
   data:{
   age:18 
} 
})//把id为xxx的年龄修改为18


return await db.collection("集合名").doc("xxx").set({
   data:{
   age:18         
    } 
})//把id为xxx的年龄修改为18,如果xxx没有年龄则删除原数据生成新数据结构为id+age

11、删除数据

let db=cloud.database;
db.collection("集合名").where({
   id:“xxx” 
}).remove()//删除id为xxx的条目


db.collection("集合名").doc(“xxx” ).remove()//删除id为xxx的条目

  

免责声明:文章转载自《小程序基础介绍》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇vlan报文处理概述使用Python操作Redis详解下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

钉钉小程序中苹果手机/iphone/IOS端音频无法播放和音频每次播放速度都加快的原因及解决方法

问题: 钉钉小程序的IOS端无法播放后台接口返回来的音频文件,但是文件在安卓端和模拟器端均可播放; 每次点击播放,音频播放速度加快一倍,导致音频无法听清; 原因: IOS端的dd.getBackgroundAudioManager()接口创建的音频管理器,manager.play()方法只能播放钉钉返回的临时的临时文件路径; 没有实例化音频的titl...

小程序下找地点、查路线、搜地铁,用这3个插件就够了!

以下内容转载自腾讯位置服务公众号文章《小程序下找地点、查路线、搜地铁,用这3个插件就够了!》作者:腾讯位置服务链接:https://mp.weixin.qq.com/s/BYJQTEChD6Df8iZfHs8wIg来源:腾讯位置服务公众号著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。   自从2017年微信上线小程序以来,小程序已经...

小程序-广告轮播/控制属性

微信小程序广告轮播元素<swiper></swiper>  图片所在元素<swiper-item>/swiper-item> 其中属性有: autoplay:true,//是否自动播放 autoplaytxt:"停止自动播放", indicatorDots: true,//指示点 // i...

nopCommerce 4.2 小程序商城(基础版)

NOP 4.2 小程序商城(基础通用版)欢迎购买或开发定制(讨论技术,没有开发预算的勿扰,谢谢)联系我 QQ:64664795(备注:CSND) 适用对象: 小商家进行商品展示及销售 有二次开发能力的创业公司及相关企业进行二次开发,节约开发时间及成本。 基础版本功能如下: #小程序端# 商城首页:轮播图片、新品、热卖、推荐商品商品分类:商品所有分类展示...

微信小程序踩坑(二)——微信小程序recorderManager和innerAudioContext相关

目录 写在前面 RecorderManager录音相关 innerAudioContext播放相关 写在前面 关于微信小程序的录音和语音方面,踩了很多坑,记录一下recorderManager相关文档innerAudioContext相关文档 RecorderManager录音相关 在使用RecorderManager相关方法之前,在page外...

uni-app中nvue (weex) 注意事项

前言 uni-app 是 DCloud 出品的新一代跨端框架,可以说是目前跨端数最多的框架之一了,目前支持发布到:App(Android/iOS)、H5、小程序(微信小程序/支付宝小程序/百度小程序/字节跳动小程序),目前市面上类似的框架还有:Taro(京东出品)、Megalo(网易出品)。 uni-app 的 nvue 说白了就是 weex 的那一套东西...