微信小程序开发常用知识点

与iOS开发很相似，小程序的导航栏也可以全局设置一下，在公共文件appjson中设置了导航栏相关样式如下：

这个地方是全局设置，如果想要在不同的页面设置各自的标题属性，只需要在该子级文件中设置

子页面想调用共公js的方法，需先在子页面js中先实例化app:具体过程如下

在需要调用的子页面中，

如果是嵌套循环，很容易出现多个list和index，例如表视图一样，所以在小程序中可以重命名 list 和index 方法为：wx:for-index='重命名' wx:for-list="重命名"

在APP开发中，UI复用是一个很好的手段，在小程序上就是模板template。

在逛小程序联盟的时候发现了一个大湿总结的比我好，搬过来一下。

微信小程序中，如果几个页面中需要引用同一个header/footer，当定义了公共模板时，有两种引用方法如下：

方法一：在公共模板中定义template元素，利用 方法 ,这种方式只会显示公共模板的template里面的内容，之外的内容不会显示

方法二:

总结：import方式和imclude方式的不同在于前者仅引用公共模板中的template里面的内容后者仅引用template以外的内容，显而易见，include方式更简单一些，在wxml中只需要一句话即可。

rpx单位是微信小程序中css的尺寸单位，rpx可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在 iPhone6 上，屏幕宽度为375px，共有750个物理像素，则750rpx = 375px = 750物理像素，1rpx = 05px。

具体的 这里有一片文章介绍的很详细 ， 还有这个

小程序的事件主要有：

小程序中的wxml中绑定事件有两种：以touchtab为例 ，在wxml中必须有bind/catch不然无法实现上述事件

bindtouchtab和catchtouchtab bind的不会阻止事件冒泡（元素最里层到最外层函数执行），catch会阻止冒泡，只是冒泡到当前层结束

如果想在元素执行某事件时把元素的某个属性传到后台 可在元素中加入data-属性名称=“xxx”,在事件函数中 function(event){}的event中的currentTarget里面的data-set里面可查看接收在元素中绑定的的id或者其他属性clientX/Y 查看滑动手指距离屏幕左侧的位置，查看滑动位置也可以通过touchstart和和touchend的clientx/y获取

看到几个别人写的，瞬间石化，果断收藏。

在小程序中，定义了一项工具文件utils,此文件的js旨在本文件之内有效，当其他子页面想调用其中的js方法或者变量时，需要两步骤：

1：在utils被调用的js文件中，面向对象的方式模型输出： moduleexports={要调用的函数名称：要调用的函数名称 }；

2：在要调用的js文件中模块化引入utils的js文件 var object=require("utils被调用的js文件地址")； 可以输出一下object就能看到被调用的方法了；

例子如下：

要调用的js文件：

小程序的后台获取数据方式get/post具体函数格式如下：wxrequest({})

如果屏幕中某元素的内容超过此元素的高度，可设置元素为scroll-view 为滚动状态元素，这样可以做到元素固定高度且元素内容滚动屏幕不滚动的效果；

scroll-view标签的主要属性分为以下几种：

微信小程序广告轮播元素 所在元素/swiper-item>

其中属性有：

更改事件：bindchange='imgchange' imagechange()的edetailcurrent为当前显示页面的下标值

1、fixed定位一个 image标签，width: 100vw;height: 100vh; mode选择aspectFill

2、background-size: cover

     1）是按照的比例放大或者缩小至充满容器，而不是按照容器的比例大小来缩放。

      2）如果照片的比例和容器的比例是不一致的，必定会导致照片的不完整性。

你好，很高兴回您的问题。

您说的要求，拆开来看，估计指的就是网服务器响应速度和安全性吧！

我结合自己做的网站和小程序来聊一聊：

我是搞了一台老马家的阿L云服务器，下载了DZ自行安装，后来又装了小程序插件。因为我的站点访问量不大（每天300IP左右），所以买了2核4G2M性能突发型的（后台其实现在可能改成无性能约束模式，只要一天重负载时间不长是不用额外收费的），新人买3年不到2000，打开网站和小程序，还是比较流畅的，感觉目前是够用的。

我的基本情况了解了，再来聊聊网服务器响应速度和安全性。

响应速度

其实响应速度又跟服务器硬件配置、带宽、和客户网络有关。

硬件配置：我上面说到的2核4G，就是我这台服务器分配2个核心和4G内存，核越多，内存越大，运算速度越快，跟我们平时使用的电脑是一样的。带宽：我上面说到的2M，就是给我这台服务器分配的带宽，网络带宽是指在单位时间（一般指的是1秒钟）内能传输的数据量。网络和高速公路类似，带宽越大，就类似高速公路的车道越多，其通行能力越强。客户网络：同样访问一个网站，用移动，电信、联通网络，或者地域不同，访问速度也有差异。

安全性

一般独立服务器，安全这块是要自己配置的；一般来说，云主机安全性要比独立的物理服务器好多了，云服务器自带的防火墙或者杀毒软件。目前国家比较大的，T讯，阿L，天L，H为，个人觉得还是阿L稍好，省心一点。

至于服务器选择这块，本着物尽其用，够用就好的原则，根据自己用户访问量来做出选择。新开站初期，访问量不大，服务器性可以用那么强大。购入之前想想这几个问题：

1服务器运行什么应用？

2需要支持多少用户访问？

3需要多大空间来存储数据？

我的业务有多重要至于性能问题，我们认为需要评估用户数量才能决定。

如果不经过实际需求的评估，轻率的选择一台性能强劲、价格昂贵的服务器，无疑是会带来成本上的浪费。

总之，基本就是这样了，不知道我说明白了没有。

我是老段，一个40多岁还有做自媒体的老大叔，有关于电子，电脑，机床，数控，网络，自媒体方面的都可以问我，一起交流学习。

微信小程序开发可根据 getLocation 获取用户的地理位置信息，包含经纬度、移动速度、海拔信息，也可使用 onLocationChange 实时获取位置。测试了一下，坐标和海拔还是比较准确的。

鉴于部分同学提到坐标误差大的问题：其一，可能是在开发者工具中遇到该问题，原因是电脑中没有gps模块，无法准确获取位置，一般通过ip定位到行政区域；其二，坐标格式没有正确使用，微信提供了两种格式 wgs84 和 gcj02 ，前者是全球GPS系统使用的标准格式，后者是中国测绘局公布的国标，两者定位有一定偏差。这就要求开发者以何种方式获取的坐标，就应以何种方式解析；也可对坐标转换后再解析。

对于用户已授权定位的可直接通过以下方式获取：

对于不确定用户是否已开启定位权限的，应该分两种情况处理：

1、用户从未同意或拒绝授权定位权限的，可直接通过 authorize 发起授权，授权成功后即可获取位置信息。

2、由于微信为了更好的用户体验，当用户第一次放弃授权定位权限后，在此后使用的过程中，不会再向用户发起授权。这就需要引导用户开启定位权限。若 authorize 时提示 authorize:fail ，可通过 openSetting 引导用户开启授权，用户授权后即可获取位置信息

实时位置信息同样需要用户授权；

微信提供了 onLocationChange 来监听实时位置信息，需要结合 stopLocationUpdate （ 小程序前台运行时监听 ）、 startLocationUpdateBackground ( 小程序前后台运行时监听 ) 使用，如下：

注：实时定位反应稍微慢一点，一般五秒后才能返回新的坐标，原因是多方面的，比如天气、建筑物、数据传输、数据处理等等。

pageonload

判断pageonload 中是否定义了 thisuserInfoReadyCallback

❗️注:因为 wxgetUserInfo 是异步的，不知道异步先执行完毕还是pageonload先执行完毕

微信小程序 开发--从px到rpx:

我一直在想，我是不是有必要再写这一节，还是给大家提供一些阅读链接。

因为关于单位的定义都是比较官方的。没什么好讨论的，我这里做一个汇总和简单的说明吧。

首先本文只以移动设备为例说明。

本文摘要：设计师以iphone6为标准出设计稿的话，1rpx=05px=1物理像素。Photoshop里面量出来的尺寸为物理像素点。所以可以直接使用标注尺寸数据。

--------------------------------------看懂本文摘要的话，就不用阅读下面的内容了-------------------------------------

英寸Inch英寸表示屏幕斜对角线的长度。如下图所示：

像素Pixel像素是图像的基本采样单位，它不是一个确定的物理量，因为像素点的物理大小是不确定的。如图:

分辨率分辨率是屏幕像素的数量，一般用屏幕宽度的像素点乘以屏幕高度的像素点。如描述iphone6的分辨率是7501334

分辨率又分为物理分辨率和逻辑分辨率，值得注意的是实际工作中设计师常常给的是物理分辨率，程序中用到的是逻辑分辨率，但是都称为分辨率，容易混淆。

物理分辨率是硬件所支持的分辨率，逻辑分辨率是软件可以达到的分辨率。

物理分辨率和逻辑分辨率的商称为像素倍率dpr，也就是常说的几倍屏。

如下图中所示，iphone6的分辨率写着375667，这里指的就是它的逻辑分辨率。我们上面提的7501334则是它的物理分辨率。

所以iphone6的像素倍率=（7501334）/（375667）=2

理解了上述的几个概念，我们就可以接着来看下面的几个单位。

pxpx就是Pixel的缩写，就是指像素。这个作为采样的基本单位，没什么需要特别说明的。

rem在做移动端适配是最常用的方法就是使用rem作为单位，因为rem是根据html的fontsize去动态计算实际的px的。

所以常常应用这点，做反向使用。即根据屏幕大小动态的设置fontsize来达到不同的分辨率下有一样的效果。

rpxrpx其实是 微信 对于rem的一种应用的规定，或者说一种设计的方案，官方上规定屏幕宽度为20rem，规定屏幕宽为750rpx。

所以在微信 小程序 中1rem=750/20rpx。

但是这不是我们要关注的重点。

在使用rem时，我们常常让设计师根据iphone6的标准出设计稿。因为如果以iphone6为标准，并且在iphone6上将fontsize设置成625%。

那么1rem就等于10px，我们只要将设计师标注的尺寸（一般标注的是物理分辨率）除以20就可以得到单位为rem的数值了。

在 iPhone6 上，屏幕宽度为375px，共有750个物理像素，则750rpx = 375px = 750物理像素，1rpx = 05px = 1物理像素。

css中的px与设备的物理像素并非绝对的一比一关系。

px与物理像素的比例与设备的dpr（像素倍率）有关。

rpx称为相对像素值，rpx与物理像素也并非绝对的一比一关系。

wxss将设备宽定义为750rpx，是以iPhone6的分辨率（750x1334）为基准划分的。

也就是说，在iPhone6上，1rpx=1物理像素=05px。

因为设计师标注的尺寸一般是物理分辨率。所以如果以iphone6为标准出设计稿的话，那么我们就可以不需要经过换算直接标准rpx。

这节课的内容就到这里结束了。

感谢您的阅读。

以上就是关于微信小程序开发常用知识点全部的内容，包括:微信小程序开发常用知识点、小程序自适应背景图,不同屏幕比例 如何做到不变形、不留空白、小程序服务器有什么要求等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！