美文网首页让前端飞
小程序实践问题记录

小程序实践问题记录

作者: rain_li | 来源:发表于2018-07-22 18:50 被阅读1次

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上的,赋值一定要找中间变量,否则就会覆盖掉原有的值

未完待续······

更多文章: https://xiaodian-li.github.io/

相关文章

  • 小程序实践问题记录

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

  • 小程序WebView实践记录

    前言 小程序不能使用WebView一直是很大的痛点,终于在11月3日,开通了WebView支持的能力,于是开始了我...

  • 小程序踩坑

    主要内容 记录小程序开发中碰到的问题以及解决方案 CSS部分 解决小程序按钮border无法清除问题 小程序按钮 ...

  • 微信小程序日常问题记录

    本文主要记录工作中关于小程序方便的问题记录: 1.小程序中textarea标签属于小程序原生组件,层次最高,往往出...

  • 微信小程序开发日记(1)—— 起点

    为了熟悉微信小程序的设计以及程序限制,动手实践设计了一个小程序——「聚会报名」,在此做些简单的整理记录。 缘起 有...

  • 小程序问题记录

    1.scroll-view 横向不滚动2.js 中方法之间一定要加上 ','3.scroll-view 两个方法b...

  • 使用antmove微信小程序转换支付宝小程序

    本次有需求 直接一直微信小程序到支付宝小程序。记录一下使用antmove转换遇到的问题 支付宝小程序与微信小程序的...

  • 微信小程序 - 问题记录

    记录下遇到的小问题及解决办法 小程序图片地扯转base64 微信小程序自定义Modal弹出框 小程序请求超时处理 ...

  • 小程序实践

    项目是否适合移植到小程序上? 小程序由于微信提供了一些组件,在微信中的一些体验确实不错,对于开发来说,由数据驱动的...

  • 踩坑集

    简介 小程序个人开发中遇到的问题记录,其中包括了小程序对于ES6部分不支持,样式的不兼容,页面传值缺失等问题。问题...

网友评论

    本文标题:小程序实践问题记录

    本文链接:https://www.haomeiwen.com/subject/yqkrmftx.html