生成图片这个功能需要使用 Canvas ,先将要保存的图片使用 Canvas 画出来,然后调用相关方法保存到手机上。文中使用或是未使用的有关小程序中 Canvas 的 api 可以在 小程序Canvas相关Api 这里查看。
为了使用方便,我将这个需求的实现做成了一个组件,便于项目的其他地方复用,也遇到了一些因为使用自定义组件带来的问题
生成图片这个功能需要使用 Canvas ,先将要保存的图片使用 Canvas 画出来,然后调用相关方法保存到手机上。文中使用或是未使用的有关小程序中 Canvas 的 api 可以在 小程序Canvas相关Api 这里查看。
为了使用方便,我将这个需求的实现做成了一个组件,便于项目的其他地方复用,也遇到了一些因为使用自定义组件带来的问题
部分摘抄自 官方文档
target | currentTarget | |
---|---|---|
定义 | 触发事件的组件的一些属性值集合 | 当前组件的一些属性值集合 |
dataset | 事件源组件上由 data- 开头的自定义属性组成的集合 |
当前组件上由 data- 开头的自定义属性组成的集合 |
现在的前端开发中我们已经习惯了使用 npm
包,但是微信小程序的目录结构显然与我们开发的普通 Vue
项目是不一样的,那么如果我要在微信小程序中使用一个 npm
包的话,我们应该如何操作呢,其实也很简单
在小程序中组件的使用是很方便的,但是有的时候我们想要强制调用组件的某个方法来刷新值或者进行其他的操作,而组件并未直接向外部暴露出方法来,该怎么办呢
首先给要调用方法的组件的 wxml
元素上添加一个 ID
,然后在 js
中先定义一个变量,onload
的时候给变量赋值组件的实例,这样组件的实例就在当前 page
中都可以用了,调用组件中 methods
中的方法即可
let iptNumberComponent
iptNumberComponent = this.selectComponent('#ipt-quantity')
iptNumberComponent.updated()
小程序的 onLaunch
和页面级的 onLoad
异步执行,这两个的执行顺序是不一定的,在 onLaunch
中请求还未返回的时候, onLoad
可能就执行了,需要加判断
封装一个全局方法,便于其他页面使用,我们的业务逻辑是只有当用户执行到下单或分享等必须操作时才需要用户登录,用户登录需要先授权个人信息,如果用户授权过个人信息,下次进入的时候就直接登录,登录成功后会赋值 getUserInfoFlag
为 true
。
轮播图的点的样式相关类名如下所示,稍作修改便可实现一些设计上的简单的效果了
wx-swiper-dots
wx-swiper-dots-horizontal
wx-swiper-dot
wx-swiper-dot-active
小程序的wxss文件font-face的url不接受http地址作为参数,可以接受base64,因此可以先将字体文件下载后,转换为base64,然后引用。字体转换网站
小程序项目基础搭建,方便快速开发原生小程序,使用脚手架的同学随意