微信小程序开发 --02

微信小程序在开发中,难度系数不是很大,其中应用的技术也是web开发中常用的技术,虽然在微信开发者工具中的叫法与常见的web开发的叫法不太一样。

首先,在微信小程序开发中,代码文件格式大体有以下四中:

.wxml .wxss .js .json

首先,wxml后缀的文件类似于html和xml的结合,例如在html中常用的div在微信小程序开发中被替换成了view,而在html中输出文本用的p标签被替换成了text标签,引入图像由html中的img 标签变成了image标签,等等。如果你之前开发的web客户端,那么你会发现,微信小程序的布局对你来说熟悉的简直不能再熟悉。

wxss 后缀的文件起始就是我们常见的css文件,只不过文件的后缀不同,在其中同样可以使用传统css中使用的种种属性。那么是否我们在css中使用的选择器是否可以在微信小程序中使用呢?

大体上我们常用的css选择器都是支持的。

那么需要注意的是,在我们之前的前端开发中,html中如果需要使用css,需要使用link标签来引入css文件,但是在微信小程序开发中,则不需要引入。微信小程序会自动的将.wxml .wxss .js .json这四种文件后缀的文件自动合成一个文件,这其中的逻辑和操作不需要我们去思考和操作。

.js 文件里面放置业务逻辑代码,主要语法就是JavaScript语法。而且在微信小程序开发中支持es6的语法,但是需要注意的是微信小程序并不是支持全部的es6语法,而且在编译的时候也是通过babel将es6的语法转换为es5的语法。

.json文件主要是放置一些当前页面的配置信息。

当然在开发微信小程序的时候,还有一点需要注意,就是在一个目录下面的代码文件,代码的名字最好一致。

__Tip:__

在开发微信小程序的时候,当进行页面的布局的时候可以使用一些ui库,也可以自己通过代码去设置样式,但是在自己写样式代码的时候,我个人还是比较推荐使用css3中新增加的flex布局方式。如果你不太属性,可以点击http://www.cnblogs.com/liujunhang/p/6992829.html这里参考。

微信小程序开发 -- 02的更多相关文章

  1. 微信小程序开发 [02] 页面注册和基本组件

    1.页面注册 既然我们希望跳转到新的页面,那自然要新建页面相关的文件才行.在开篇已经讲过,一个小程序页面由四个文件组成,假如我们的页面名为welcome,那么这四个文件则是: welcome.js w ...

  2. 微信小程序开发笔记02

    今天学习了微信小程序开发用到的语言,wxml与wxss语言基本语法与html和css基本语法相似,学习起来相对简单.在小程序主要的语言是js(javascript,跟准确的说是jqery) ,由于这种 ...

  3. timestamp时间戳的应用(微信小程序开发也一样)

    在微信小程序开发时发现一个timestamp的时间戳的变量 比如获取微信运动步数时候 timestamp是如何形成的在JS中 是这么形成的 var timestamp = Date.parse(new ...

  4. 零基础入门微信小程序开发

    注:本文来源于:<零基础入门微信小程序开发> 课程介绍 本达人课是一个系列入门教程,目标是从 0 开始带领读者上手实战,课程以微信小程序的核心概念作为主线,介绍配置文件.页面样式文件.Ja ...

  5. 微信小程序开发环境安装以及相关设置配置

    微信小程序开发环境安装以及相关设置配置 一.安装 软件名称:wechat_devtools_1.02.1907232_x64 软件安装地址:https://developers.weixin.qq.c ...

  6. 微信小程序开发心得

    微信小程序也已出来有一段时间了,最近写了几款微信小程序项目,今天来说说感受. 首先开发一款微信小程序,最主要的就是针对于公司来运营的,因为,在申请appid(微信小程序ID号)时候,需要填写相关的公司 ...

  7. 【微信小程序开发•系列文章六】生命周期和路由

    这篇文章理论的知识比较多一些,都是个人观点,描述有失妥当的地方希望读者指出. [微信小程序开发•系列文章一]入门 [微信小程序开发•系列文章二]视图层 [微信小程序开发•系列文章三]数据层 [微信小程 ...

  8. 微信小程序开发日记——高仿知乎日报(下)

    本人对知乎日报是情有独钟,看我的博客和github就知道了,写了几个不同技术类型的知乎日报APP 要做微信小程序首先要对html,css,js有一定的基础,还有对微信小程序的API也要非常熟悉 我将该 ...

  9. 微信小程序开发日记——高仿知乎日报(中)

    本人对知乎日报是情有独钟,看我的博客和github就知道了,写了几个不同技术类型的知乎日报APP要做微信小程序首先要对html,css,js有一定的基础,还有对微信小程序的API也要非常熟悉 我将该教 ...

随机推荐

  1. CF #284 div1 D. Traffic Jams in the Land 线段树

    大意是有n段路,每一段路有个值a,通过每一端路需要1s,如果通过这一段路时刻t为a的倍数,则需要等待1s再走,也就是需要2s通过. 比较头疼的就是相邻两个数之间会因为数字不同制约,一开始想a的范围是2 ...

  2. 学习MVC之租房网站(五)-权限、角色、用户管理

    在上一篇<学习MVC之租房网站(四)-实现Service层并进行单元测试>中,记录了实现Service层并进行单元测试的过程,接下来该到"正题"-MVC了,也就是UI层 ...

  3. Lambda表达式效率问题

    原文 http://www.importnew.com/17262.html 有许许多多关于 Java 8 中流效率的讨论,但根据 Alex Zhitnitsky 的测试结果显示:坚持使用传统的 Ja ...

  4. JavaWeb的国际化(17/4/8)

      国际化的缺点: 因为文字不同,所以带来的排版问题一样严重,通常都是重新在写一个网站反而更加清晰,快捷 1:需要从浏览器中获取到浏览器语言(Accept-Language) 2:利用locale获取 ...

  5. 【知识必备】浅淡MVP在Android项目中的实战演习,让代码结构更简单~

    一.写在前面 讲道理,这次是真的笔者很久都没有更新blog了,主要最近维护的框架问题也是层出不穷,而且对技术交流群的解答也让我身心疲惫,所以在这里跟关注我的人说声抱歉,没有定期给你们带来福利,那么这里 ...

  6. AJAX做增删改查详细!

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. 【Uva 10498】满意值

    Description Kaykobad教授把为ACM选手买饭的任务交给了Nasa.Nasa决定买n种不同的食物.然后他询问了m名选手对每种食物的需求量.选手们当然不会给出任何符合逻辑的回答,他们只是 ...

  8. Linux学习之竿头直上

    今天第二讲昨天我们讲解了10基础命令,今早上我继续为大家讲解10个linux常见命令 今天主要讲解与网络相关的命令和软件安装的命名 NetworkManager 与rpm 在windows中我们查看网 ...

  9. Transform java future into completable future 【将 future 转成 completable future】

    Future is introduced in JDK 1.5 by Doug Lea to represent "the result of an asynchronous computa ...

  10. 用VsCode编辑TypeScript

    文地址:https://code.visualstudio.com/Docs/languages/typescript TypeScript是Javascript的超集,它提供了类.模块.接口来帮助你 ...