先上一个效果图: 根据这个效果图我来说内容. 首先是顶部tab栏 效果实现依靠的是一个组件scroll-view.这个组件很有意思,可以多层嵌套,当然它的属性也很多. 这里主要用的是scroll-x,scroll-x的默认值是false,我们要设置为true.这一步我们仅仅是实现了可以左右滑动. 更重要的是如何判断滑动到了哪个位置,怎么获取对应内容.滑动距离由于我们是左右滑动所以这里是scroll-left,给scroll-left动态赋值. 这里我先上代码 <scroll-view scrol…
异常描述: 如下图,输入手机号码之后,点击右侧的获取验证码,在开发工具是OK的,真机测试无反应: 页面编码跟H5差不多的,H5没出现这个问题,但是小程序就不一样了. 异常分析: 页面结构层面,为了方便样式排版,手机号码输入框跟验证码输入框是一样宽的,获取验证码的层以绝对定位的方式固定在手机号码输入框的右边,如下: 对于H5来说,这个并没有什么影响,但是小程序中,这种排版,就不行了. 光标一旦进入文本框,在没有收起输入键盘或者点击文本框外其他地方的时候,文本框的聚焦状态是不会改变的. 也就是说上边…
导航栏navigation-bar 页面导航条配置节点,用于指定导航栏的一些属性.只能是 page-meta 组件内的第一个节点,需要配合它一同使用. 通过这个节点可以获得类似于调用 wx.setNavigationBarTitle wx.setNavigationBarColor 等接口调用的效果. 如果配合page-meta组件一起使用的话,可以参考官方文档 需要把navigation-bar作为page-meta的第一个节点,而且page-meta作为页面的第一个节点 <page-meta…
wxml: <!--导航条--><view class="navbar"> <text wx:for="{{navbar}}" data-idx="{{index}}" class="item {{currentTab==index ? 'active' : ''}}" wx:key="unique" bindtap="navbarTap">{{ite…
作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. 张小龙全面阐述小程序,定档1月9日上线(附90分钟演讲全文) ... 前言:新人第一坑,跳坑指南:修改后,必须保存:ctrl+S: 一:推荐地址集合:(初入门者请先看这里) 1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=147643467…
本文是以一个简单的小例子,来简要讲解微信小程序开发步骤,希望促进学习分享. 概念 微信小程序,简称小程序,缩写xcx,英文mini program.是一种不需要下载安装即可使用的应用,它实现了应用“触手可及”的梦想,用户扫一扫或者搜一下即可打开应用.也体现了“用完即走”的理念,用户不用关心是否安装太多应用的问题.将“小程序”定义为“一种新的应用形态”,应用将无处不在,随时可用,但又无需安装卸载. 开发工具 小程序有专用的开发工具,集开发,编译,测试,预览,提交于一体,方便使用,且具有语法提示功能…
微信小程序开发环境安装以及相关设置配置 一.安装 软件名称:wechat_devtools_1.02.1907232_x64 软件安装地址:https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html 使用官方文档:https://developers.weixin.qq.com/miniprogram/dev/framework/ 二.小程序项目创建以及设置 点创建项目时候其中appid是唯一的需要去自己小程序账…
本人对知乎日报是情有独钟,看我的博客和github就知道了,写了几个不同技术类型的知乎日报APP 要做微信小程序首先要对html,css,js有一定的基础,还有对微信小程序的API也要非常熟悉 我将该教程分为以下三篇 微信小程序开发日记--高仿知乎日报(上) 微信小程序开发日记--高仿知乎日报(中) 微信小程序开发日记--高仿知乎日报(下) 三篇分别讲不同的组件和功能块 这篇要讲 API分析 启动页 轮播图 日报列表 浮动按钮 侧滑菜单 API分析 以下是使用到的具体API,更加详细参数和返回结…
今天看看小程序全局配置. 上一篇[微信小程序开发]秒懂,架构及框架 配置,无非就是为了增加框架的灵活性,而定下的规则. 微信小程序的配置文件是一个树状结构,各个节点代表不同的配置项,小程序框架会解析这个文件,作为APP的全局配置. 上图…… 全局配置信息 脑子里有这个图,就比较清晰了. 配置点: 1.pages是一个字符串数组,小程序有多少个page,要把路径和文件名配置进来,第一项就是初始页面. 2.window用于配置小程序的状态栏.导航条.标题.窗口颜色等. 3.tabBar用于配置上方或…
微信小程序已经火了一段时间了,之前一直也在关注,就这半年的发展来看,相对原生APP大部分公司还是不愿意将主营业务放到微信平台上,以免受制于腾讯,不过就小程序的应用场景(用完即走和二维码分发等)还是很值得我们学习的,技术上面如果了解React的话,会发现他们在组件化上面有很多雷同之处.说白了,小程序就是基于微信平台的H5轻应用,微信将系统底层功能(设备.位置.媒体.文件等)和微信自身功能(登录.支付.分享等)封装成相应API供小程序调用. 自己根据官方文档写过一个DOME,借助和风天气开放API接…