![](https://img-blog.csdnimg.cn/20201014180756738.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
微信小程序
门时
这个作者很懒,什么都没留下…
展开
-
微信小程序(1)——项目基础架构及页面组成结构
从2017年年初微信小程序出世以来,因为它不用安装,不占内存,即点即用等优良特性,受到了广大人民群众的喜爱,越来越多的企业、组织和团体把目光投向了微信小程序的开发,微信小程序的热度也随之水涨船高。▍默认基础结构(自动创建)【注意】app.js、app.json、app.wxss作用于全局所有的页面。1、app.js:小程序逻辑。//app.jsApp({ onLa...原创 2018-07-19 09:42:33 · 16043 阅读 · 0 评论 -
微信小程序(15)——实现:回到自己的位置
遇到一个需求,需要模仿高德、百度等地图,点某一个按钮能马上回到自己的位置。wxml:<map id='map' ……> <cover-image src='……' bindtap='clickControl'></cover-image></map>js:clickControl() { // map是id ...原创 2019-04-24 11:56:55 · 2348 阅读 · 0 评论 -
微信小程序(14)——自定义按钮样式
微信小程序自带有button按钮,而button按钮中的某些类型也被赋予特殊意义,比如:获取用户信息、意见反馈等。当我们需要用到这些特殊意义的按钮时,有时需要自定义按钮的样式,究竟应该怎样处理呢?// 以下为示例,不推荐使用标签选择器,实际环境中请选择类选择器classbutton { // 修改button的padding属性时,可直接进行 padding: 0; ...原创 2019-04-22 20:58:05 · 4379 阅读 · 0 评论 -
微信小程序(13)——利用utils.js时间戳转时间
碰到一个问题:我需要在页面上显示时间,但是后台传输给我的是时间戳(而且是字符串类型的时间戳),所以我需要将时间戳转换为时间。原数据结构如下图:操作方法如下:// require utils.jsconst utils = require('../../utils/util.js');// 获取数据成功后对数据进行处理const _this = this;…succe...原创 2019-04-21 10:08:55 · 1821 阅读 · 0 评论 -
微信小程序(12)——哪些应用适合做成微信小程序
随着微信小程序的不断完善,其用户量一直处于爆发式增长状态,各类型的小程序如雨后春笋,纷纷上线。但是,受微信小程序自身的限制影响,并不是所有的应用都适合开发出一款对应的小程序。▍微信小程序三大特点1、业务逻辑简单;2、使用频率低;3、性能要求低那么对应的,有一些应用是不适合于使用微信小程序的,比如直播类(斗鱼、熊猫、虎牙等),大型游戏类(吃鸡...原创 2019-03-04 13:13:04 · 852 阅读 · 0 评论 -
微信小程序(11)——去除滚动条
微信小程序(十)——利用scroll-view实现横向滚动讲了如何实现scroll-view的横向滚动,在实现滚动之后,发现有一个横向的滚动条存在,不是很美观,所以,我就想要去除这个滚动条。▍解决方案在样式表里加上如下代码,就可以去掉丑陋的滚动条了。::-webkit-scrollbar { width: 0; height: 0; color: transpare...原创 2019-02-13 16:25:04 · 2600 阅读 · 3 评论 -
微信小程序(10)——利用scroll-view实现横向滚动
这两天想做个小程序上线试试,小程序里需要用到横向滚动,却在做的过程中发现scroll-view即使加了scroll-x,也没有实现横向滚动的效果,于是查找了一下解决方案,解决方案如下:▍解决方案1、在scroll-view标签上加上样式属性:display: flex; white-space:nowrap;2、scroll-view标签下的一级栏目标签需要加上样式属性:dis...原创 2019-02-13 15:52:17 · 11305 阅读 · 2 评论 -
微信公众测试号自定义菜单
最近在做一个基于微信公众号的资源回收系统,由于与队长的想法发生冲突的原因,就打算自己自学一下微信公众号的自定义菜单。▍概述由于目前只是在大学阶段,没有企业身份,不能进行企业注册,也就无法使用微信公众号中的自定义菜单功能(无法跳转网址),所以只能通过申请微信测试号来实现自定义菜单的跳转。以下内容也主要是针对微信测试号自定义菜单的讲解。▍参考网址...原创 2018-05-31 15:09:44 · 7706 阅读 · 0 评论 -
微信小程序(9)——多个空格写法
通常情况下,在微信小程序里,连续的多个空格只会被显示一个,那么如何显示多个连续的空格呢?▍方案一<view> <text space="ensp">你好, 哈哈哈(空格是中文字符一半大小)</text></view><view> <text space="emsp">你好, ...原创 2018-08-16 18:58:06 · 14146 阅读 · 0 评论 -
微信小程序(5)——文字溢出断尾显示省略号
▍写在前面(来访者请直接浏览下一条)在写页面的时候遇到一个问题:需要对某件商品进行描述,但是往往描述文字过长,如果全部一次性显示可能对样式的一致性造成破坏,影响页面美观,于是我联想到了之前在很多网站上见过省略部分文字的方法,决定自己实践一次。▍效果预览先贴上最终实践效果:▍实现方法【注意】为了能更清晰的了解文字超限断尾的使用方法,以下所有css代码将省略全部关于...原创 2018-08-02 13:43:20 · 7674 阅读 · 1 评论 -
微信小程序(8)——五星级评分
▍写在前面在制作一个医院类小程序的前端时,有一个功能是对医院进行评价,通过查找资料并结合自身的知识花了一个下午终于解决了。(由于知识欠缺的原因,中间一个问题阻碍了几个小时,即为下文所陈列问题的第二条)。▍效果预览分别截取了无评分状态和评价状态的页面:未选中选中▍代码实现1、feedback.js// pages/more/feedback.jsP...原创 2018-08-05 18:10:06 · 7637 阅读 · 7 评论 -
微信小程序(7)——字符转义
在制作页面的时候,偶尔会需要用到一些特殊的字符。如果不使用键盘直接输入,那么如何在屏幕上显示它们呢?▍转义方法在<text></text>中设置属性decode为true。【注意】只能在text标签中设置属性decode为true,转义字符才能生效。【示例】<text decode="{{true}}"> </...原创 2018-08-04 15:52:07 · 6282 阅读 · 2 评论 -
微信小程序(4)——CSS3渐变
CSS3 渐变(gradients)可以在两个或多个指定的颜色之间显示平稳的过渡。CSS3 定义了两种类型的渐变(gradients):1、线性渐变(Linear Gradients)- 向下/向上/向左/向右/对角方向;2、径向渐变(Radial Gradients)- 由它们的中心定义。▍demo.wxml<view class='container'> ...原创 2018-07-21 23:07:53 · 8595 阅读 · 0 评论 -
微信小程序(3)——引入百度api天气信息全过程
微信小程序本身是不提供天气api的,所以本文使用的是百度的api。▍效果图先附上个人制作的一个简易的效果图,为了排版方便,所以还有很多天气信息我没有放到页面上。▍事先准备如果想要达到预期效果,你的小程序必须满足以下条件:1、必须有【APPID】,没有APPID的小程序无法申请到请求天气信息所必需的【百度AK】;2、必须将【http://api.map.bai...原创 2018-07-21 13:04:28 · 6311 阅读 · 3 评论 -
微信小程序(6)——禁止页面滚动
▍写在前面(来访者请直接浏览下一条)最近在做一个美食类小程序的时候,需要用到一个购物车,自己不好构思,就仿照美团的购物车写了一个,然后就在这卡了一下:购物车列表是fixed脱离文本流的,在上下滚动购物车列表的时候,底部的页面竟然也会跟着滚动,这怎么成,所以我就找了一下关于这个问题的解决方案。▍效果预览首先小声说一句,为了节约时间,所以在做数据模拟显示的时候,所有的图片还有名...原创 2018-08-02 14:18:22 · 63512 阅读 · 4 评论 -
微信小程序(2)——页面跳转
微信小程序没有<a></a>标签,那么微信小程序是如何进行页面跳转的呢?▍默认提供的tabBar跳转仅需要按照规范配置即可生效,仅限于底部导航栏页面间的跳转,即app.json中的tabBar配置:{ "tabBar": { "list": [{ "pagePath": "pages/index/index", &quo原创 2018-07-19 10:44:26 · 1302 阅读 · 0 评论