9-28 钟申义 日志

小程序与网页开发的区别

开发工具的不同

网页开发是“开发工具+浏览器”，实现页面的开发，而小程序有属于自己的专门的开发者工具，可以实现同步本地文件+开发调试+编译+预览+上传+发布的一整套流程

开发环境的不同

网页的开发依赖于浏览器，是直接运行在浏览器中的，而浏览器有很多，所以需要考虑网页对浏览器的兼容性。而微信小程序是依赖于微信存在的，所以没有兼容性的问题一说

开发语言的不同

网页开发使用的就是html+css+JavaScript，属于最为原始的东西。而微信小程序有自己的一套专门用来编写页面的语言wxml+wxss+JavaScript。许多我们需要的东西，微信小程序都是已经写好了的，我们直接拿过来使用就可以了

目录结构

cloudfunctions 云开发[云函数]名字

miniprogram

images 当前项目中用到的图片的存储文件夹

pages 当前项目中所有页面（组件）

style 用来保存项目中所有自定义全局样式文件

app.wxss 全局样式

app.json 全局配置文件，创建好以后需要删除原本app.json中配置的pages下包含的文件路径，删除路径后到源文件中删除pages下包含的文件(创建pages下面的页面文件的地方，包含文件路径)

文件类型

.wxml wxml是类似于xml标记语言的文件，不是html，主要负责搭建小程序页面的结构，小程序中没有html，使用wxml替换html

.wxss wxss类似于css，用来定义全局样式{

​ 1.大小单位为rpx，自带响应式的单位

​ 2.样式中可以使用@import引入外来样式

​ 3.样式可以使用第三方组件库vant weapp

.json json文件属于页面的属性配置文件，用来配置需要使用的组件路径和一些样式的配置

.js js是专门用于微信小程序开发的一种语言，用来实现各个组件的交互功能，微信小程序的js中没有DOM和BOM

常用组件

view 视图容器，相当于html中的div元素，属于块级元素

hover-class 当view被点击时的样式，取值为string类型的类名

hover-start-time 按住多久后出现点击的样式，取值为number类型的毫秒数

hover-stay-time 手指松开多久后失去点击的样式，取值为number类型的毫秒数

text 相当于html中的span、p标签，当text单独使用的时候，类似于块级元素，单独成行，当text放到组件 中使用的时候，相当于行内元素

space 设置空格的大小 ensp(中文字符空格一半大小) emsp(中文字符空格大小) nbsp(根据字体设置空格的大小)

image 相当于html中img标签，图片默认大小：320*340

心得

感觉今天的课稍稍有一点快，只在操作简单的地方跟得上，在操作复杂的地方完全跟不上。只有在练习的时候到处问人！