前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >小程序开发之旅(持续更新中..)

小程序开发之旅(持续更新中..)

作者头像
Clearlove
发布2019-08-29 14:36:08
7500
发布2019-08-29 14:36:08
举报
文章被收录于专栏:前端客栈前端客栈

以下内容都是在0.11.112301版本中实践得出。现已更新至0.17.172600,如有版本调整,按实际情况而定,仅供出现类似情况时参考。

1. 快捷键

  1. 右键,选择格式化,格式化js、wxml、wxss等代码,也可以用Alt + SHIFT + F快捷键;

2. 知识点

  1. 小程序总会在读取Page下的data对象来做数据绑定,这个动作我们称之为A,而这个A动作的执行,是在onLoad函数之后执行的。但是在122100版本以后,this.data做数据绑定的方法已失效,并且也不建议直接通过this.data来修改数据值.
  2. 模板样式的引用。加入已存在a-template.wxml模板文件,同级目录下新建了a-template.wxss样式文件.在具体模块中需要引用模板时,则需要在具体引用模板的样式文件中,引入模板文件的样式@import xxx/a-template.wxss这里的import路径也为相对路径
  3. 小程序目前只实现了模板化,即能到标签和样式的集合的复用,但这个集合对应的交互逻辑(即js部分)却不能像引用样式文件那样直接应用,从而达到模块化的目的。
  4. 布局问题 问题背景:在一个列表页,底部有一个创建按钮,如果列表数据不够多时,它位于视图底部,如果列表数据超过一屏,则跟随列表最后面,如下图的“我也创建一个官网”;

3. 注意点

  1. 标签写法 <import src="xxx" /> 注意闭合的 / <template is="xxx" data="{{xxx}}" /> 注意闭合的/,以及data需要双花括号
  2. 路径问题 var postData = require("../../xxx/xxx.js") ,require要求必须为相对路径<import src="xxx/xxx.wxml" />,既可以相对路径,又可以绝对路径。
  3. 自定义属性值名字和获取 通过data-item-name="{{obj.name}}"在对应的标签上设置需要传递的属性值,然后在对应的事件中通过event.currentTarget.dataset.itemName来获取对应的name值,需要注意的是data-item-name自定义属性在获取时,data-会被忽略,并且后面的连字符-会被转化为驼峰格式变量itemName。如果连字符直接的某个字符串中有大写如data-postId,最后会被转化为小写,要通过event.currentTarget.dataset.postid来获取,这点需要注意。
  4. wx.showActionSheet()方法中的success回调函数参数中,res.cancel若用户没有点击取消则为undefined并非false,而当用户点击取消则为true
  5. 模板中引用图片等外部资源路径 使用模板是为了复用,如果是项目根目录中有独立的模板文件夹,对应引用根目录下的类似static文件夹中的image等资源,路径是相当固定的,可以用相当路径。但如果是某个模块内部的模板,被复用时,可能会因为路径的原因,导致引用失败,这点是需要注意的,建议使用绝对路径
  6. app.jsonpages新增一条不存在的文件路径,例如pages/test这时候会pages目录下生成test.jstest.jsontest.wxmltest.wxss四个文件,相当于快键新建,不过这种做法有点坑爹~~
  7. json文件配置backgroundColor 小程序文档里面关于backgroundColor描述是窗口的背景色,但是让人误解的是视口屏幕的背景色。实际效果如下:

4. 待讨论

  1. 长度单位 用px值:margin-top/margin--bottom,letter-spacing, border
本文参与 腾讯云自媒体分享计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体分享计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 1. 快捷键
  • 2. 知识点
  • 3. 注意点
  • 4. 待讨论
相关产品与服务
云开发 CloudBase
云开发(Tencent CloudBase,TCB)是腾讯云提供的云原生一体化开发环境和工具平台,为200万+企业和开发者提供高可用、自动弹性扩缩的后端云服务,可用于云端一体化开发多种端应用(小程序、公众号、Web 应用等),避免了应用开发过程中繁琐的服务器搭建及运维,开发者可以专注于业务逻辑的实现,开发门槛更低,效率更高。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档