![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
小程序开发
forwiat
脚踏实地,仰望星空
展开
-
小程序开发之【前端开发】【学习第二节】【一】
学习前必须了解的:得了解到小程序视图层WXML,WXSS,以及逻辑层JS,这些是小程序开发的核心内容。小程序框架将整个系统划分为视图层和逻辑层,视图层由框架设计的标签语言(WeiXin Markup Language)和用于描述WXML组件样式的WXSS(WeiXin Style Sheets)组成,它们的关系就像HTML和CSS的关系。WXML和WXSS在渲染时会被框架解析为不同端的本地...原创 2018-11-06 20:46:53 · 3506 阅读 · 1 评论 -
小程序开发之【前端开发】【学习第二节】【二】
承接上一篇继续写的。。。下面,得学习app.js,也就是小程序的逻辑文件。在这个文件中,我们可以通过App()函数注册小程序生命周期函数,全局方法和全局属性,已注册的小程序实例可以在其他逻辑层代码中通过getApp()方法获取。App()函数用于注册一个小程序,参数为一个Object对象,在这个参数对象中,我们可以注册自定义方法和属性,供全局使用。就像quick start项目中,我们利用...原创 2018-11-06 20:47:35 · 526 阅读 · 0 评论 -
小程序开发之【前端开发】【学习第二节】【三】
讲完小程序框架主体文件后,下面要说的就是框架页面文件。一个框架页面包含4个文件,同一框架页面的这4个文件必须具有相同的路径与文件名,进入小程序或页面跳转时,小程序会根据app.json配置的路径找到对应的资源进行渲染。.js文件:页面逻辑文件,必要项.wxml文件:页面结构文件,必要向.wxss文件:页面样式文件.json文件:页面配置文件页面配置文件首先要讲下页面配置...原创 2018-11-06 20:50:15 · 708 阅读 · 0 评论 -
小程序开发之【前端开发】【学习第二节】【四】
承接上面的来说,WXML具有数据绑定,列表渲染,条件渲染,模板和事件等能力。1.数据绑定小程序页面渲染时,框架会将WXML文件同对应Page的data进行绑定。绑定使用Mustache语法(就是两个大括号)(1)简单绑定<!--内容--><view>{{content}}</view><!--组件属性--><view i...原创 2018-11-06 20:54:52 · 439 阅读 · 0 评论 -
小程序开发之【前端开发】【学习第二节】【五】
接着上一篇说,下面说一下事件对象,如果没特殊说明,当组件触发事件时,逻辑层绑定该事件的事件处理函数会收到一个事件对象<view bindtap="myevent">view</view>myevent:function(e){console.log(e)},myevent的参数e便是事件对象,类似于JavaScript事件绑定。事件对象属性分为三类:Ba...原创 2018-11-06 20:56:34 · 304 阅读 · 0 评论 -
小程序开发之【前端开发】【学习第二节】【补充】
这里补充下模块化的方法通过exports暴露接口,通过require(path)引入依赖,path是需要引入的模块文件的相对路径例如:新建的mod.jsfunction run(who){console.log(who+'run');}function walk(who){console.log(who+'walk');}module.exports.run=run;...原创 2018-11-06 20:57:29 · 198 阅读 · 0 评论 -
小程序开发之【前端开发】【学习第三节】【一】
这一节就是学布局了。盒子模型是CSS布局的基础,CSS假定每个元素都会生成一个或多个矩形框,每个元素框中心都有内容框content,内边距padding,边框border和外边距margin,这些默认为0.盒子模型根据浏览器具体实现可分为W3C标准盒子模型和IE盒子模型,这两种盒子模型在宽度和高度的计算不一致,WXSS完全遵守W3C盒子模型规范。元素按照显示方式分为块级元素和行内元素。我们...原创 2018-11-06 21:00:05 · 419 阅读 · 0 评论 -
小程序开发之【前端开发】【学习第三节】【二】
flex布局flex布局主要由容器和项目构成。采用flex布局的元素,称为flex容器(flex container),它的所有直接子元素自动成为容器成员,称为flex项目(flex item)。可以通过设置display:flex或display:inline-flex将任何一个元素指定为flex布局。容器默认存在两根轴,水平的主轴(main axis)和垂直的交叉轴(main axis),...原创 2018-11-06 21:00:47 · 577 阅读 · 0 评论 -
小程序开发之【前端开发】【学习第一节】
学习前必须了解的:学习第一天,先要了解下小程序是什么。按官方说法来说,小程序是一种不需要下载安装即可使用的应用。(这种说法应该算比较勉强),从技术层面上说,小程序采用了类似React Native和Weex一样的解析技术,开发者可编写一套代码在多端运行(Android微信,IOS微信,浏览器)。其实严格来说,小程序也是需要下载安装的,只是由于技术实现方案和官方规定小程序包容量不得超过1M,使得...原创 2018-11-06 20:45:22 · 507 阅读 · 2 评论 -
小程序开发之【前端开发】【总结】
学到这里,前端基本上是学完了,剩下的是组件和小程序的api,我们只需在用时做到灵活使用就行,不需要死记硬背,在做的过程中记住就可以了。有了前端框架的讲解基础,前端布局的基础,相信在使用组件和api上是比较简单的,多做多积累经验,就能做出一个较为优秀的小程序前端了。接下来,是小程序后端开发及服务器的搭建了。...原创 2018-11-06 21:01:15 · 573 阅读 · 1 评论