小程序实践问题记录

1.开始添加项目,报错如下VM838:2 未找到入口 app.json 文件,或者文件读取失败,请检查后重新编译。

原因的项目目录不对,只识别app,文件夹下不能有二级目录,什么配置以及docs都是自己加的 ,小程序不识别

2.地图开发

2-0.map等组件是由客户端创建的原生组件,层级最高,不能通过z-index控制层级覆盖

------cover-view、cover-image 只有这两个可以在地图层级之上。

------1.9.0之下,上述两个标签只能嵌套在 map 等原生组件里面,以后的版本可以嵌套在view组件之上

-----cover-view嵌套在map组件中时,宽高超过map的宽高的时候,会被剪切。

2-1.地图满屏: 设置width: 100%; height:100% 不管用

这时候用,整个屏幕默认满屏为100vh;所以将地图的高度设置为100vh宽度设置为100% 即width: 100%; height:100vh即可

2-2.覆盖在原生组件之上的文本视图,可覆盖的原生组件包括map、video、canvas、camera、live-player、live-pusher,只支持嵌套cover-view、cover-image

2-3.我也不知道经纬度中心设置之后,markers开始不显示,

到最后就好了,不知道是缓存还是因为我设置的marker标记点离中心点太远,我没看见——–待解

2-4.其他看文档就很详细

3.点击事件

  • 事件是视图层到逻辑层的通信方式

  • 事件可以将用户的行为反馈到逻辑层进行处理

  • 事件可以绑定在组件上,当达到触发事件,就会执行逻辑层中对应的事件处理函数。

  • 事件对象可以携带额外信息,如 id, dataset, touches。

  • 3-1. 使用 bind
    开头的事件绑定,这种绑定不会阻止冒泡事件向上冒泡—bindtap

  • 3-2. 使用 catch 开头的事件绑定,这种绑定可以阻止冒泡事件向上冒泡—catchtap

  • 3-3. tapName函数事件提供了足够多的信息,也就是event对象

event对象中的target是事件产生的源头组件,而currentTarget则是当前捕获这个事件的组件

  • 3-4.子组件的事件传给父组件
this.triggerEvent('PayDetail') // PayDetail为自定义名字

在父组件接收使用

在wxll中:
bind:PayDetail='PayDetail'

在js中:
PayDetail () {
    console.log(PayDetail具体方法内容)
}

4.map下marker的气泡动态传入值?

不在data里,在发布里利用ES6字符串模板动态添加

5.组件形式和vue如出一辙

需要注意<text></text>,合并写分开写的不同,分开写默认空行会解析,并不是传统的行级标签

如下

<text>lixiaodian</text>

展示为

lixiaodian

如下

<text>li
xiaodian</text>
li
xiaodian

6.微信的滑块视图容器swiper组件

一个swiper会嵌套swiper-item,横向有几个就套几个swiper-item,

but

当纵向是列表时,ios8,9,10会出现swiper-item里的所有内容是150px;并出现滚动条, 下方留白,目前微信并没有修复这个问题

暂时解决,不用swiper,自己用view写,缺点是少了过度动画,但是加上wx.loading会好很多

7.判断条件

wx:if ==> v-if // 保条件块在切换时销毁或重新渲染
wx:elif
wx:else
 
 
hidden='{{haveOrders}}'  ==> v-show // 组件始终会被渲染,只是简单的控制显示与隐藏。 判断如果haveOrders是不展示,用于多种状态是很好选择

8、<block/>

并不是一个组件,它仅仅是一个包装元素,不会在页面中做任何渲染,只接受控制属性。

9.{{}}写法

wx:if这种需要有{{}}, 事件不需要,定义的文本需要

10.列表切换可以在请求前加wx.showLoading提升体验

11.组件中使用slot插槽

插槽的样式需要定义在组件调用的页面;并且在开发工具上看可能样式没有生效,在真机上看看。开发工具上显示的节点树有问题,如果真机上还不对,那可能是真的出问题了。

12.小程序接入高德地图

在真机上预览时,需要打开调试(放开url校验),否则地图不能正常显示

13.地图上的markers

不管事markers,还是别的挂在data上的,赋值一定要找中间变量,否则就会覆盖掉原有的值

14. 分包加载 核心在于 页面包分配, 只需要载app.json里面配置好对应的文件就可以.

15. 高德地图小程序sdk,路线规划,可以使用waypoints指定途径地点

16. polyline 是个数组,可以在地图上一次渲染多条线

17. map等原生组件、自定义组件,外面不要再加一层 wrapper, 否则会产生不可知的问题.

18. 小程序的体验版默认的落地页是pages/index/index, 如果采用分包加载或者改变了入口页路径,需要在管理平台-开发版本-修改页面路径处, 更新落地页路径,否则会提示页面路径不存在。

19. 更新data中数据this.setData({}) 里面的数据不宜太多,多出2W1多就会报错 报错如下:vdSyncBatch 数据传输长度为 1304693 已经超过最大长度 1048576

20. 接入passport登录, 提示5003 微信服务异常,需要提供小程序的 appid、appsecret,供平台注册,增加新的枚举值。然后,分配新的djfrtthsourceext值

21. 小程序中 图片名 有空格,在安卓手机中不能正常加载,而ios中正常显示,需要注意

22. cover-view 组件在设置背景色的时候,在部分ios手机上无效,需要给设置背景色的元素加上border-raius: 0.1px即可

点赞