类似图片在开发小程序项目的时候： 1.记得设置宽高 2.设置缩放模式mode="aspectFill" 类似类似 ``` - 组件 ``` 1.轮播图组件 ``` #### 2.2 样式 WXSS - rpx单位(responsive pixel 响应式的像素) ``` 基于750分辨率自动计算设计稿也是基于750px的 1rpx物理分辨率---0.5px逻辑分辨率 ``` - 样式的导入 ``` import '*.wxcss' ``` #### 2.3行为 JS - ECMAScript标准 - 微信小程序不存在DOM和BOM的概念，但是微信封装了顶级对象：wx对象（window） #### 2.4 配置 *.json - 非常严格的json格式（“”，“”），只能用双引号 - app.json ``` pages:配置项目的页面路径 Windows：配置项目窗口表现 ``` ### 3.微信小程序文件结构 #### 3.1主体文件结构主体部分由三个文件组成，必须放在项目的根目录，如下： | 文件 | 必填 | 作用 | | -------- | ---- | -------------- | | app.js | 是 | 小程序逻辑 | | app.json | 是 | 小程序公共设置 | | app.wxss | 否 | 小程序公共样式 | #### 3.2页面文件结构页面由四个文件组成，分别是： | 文件类型 | 必填 | 作用 | | -------- | ---- | --------------------------------------------------- | | js | 是 | 页面逻辑（微信小程序没有window和document对象有wx） | | wxml | 是 | 页面结构（XML语法，不是HTML语法） | | wxss | 否 | 页面样式表（扩展了rpx尺寸单位，微信专属响应式像素） | | json | 否 | 页面配置（不能写注释，否则编译报错） | ### 4.页面功能说明 #### 4.1首页 ``` 首页轮播借助小程序自带轮播组件

请求地址为：https://locally.uieee.com/slides 备注：wx:request()发送资源请求时，需要在小程序开发者中添加好请求的域名，需在详情中勾选：不校验合法域名、web-view（业务域名）、TLS 版本以及 HTTPS 证书，但是后台会出现警告，当手机调试发现请求图片不显示时，需在image中加入lazy-load 懒加载属性首页导航列表数据：利用flex弹性伸缩盒子布局，适应屏幕性效果增加请求地址为：https://locally.uieee.com/categories ``` #### 4.2shoplists九宫格点击进入相应商品信息列表 ``` 思想：写一个pages多个页面重复调用，根据,利用每项的id不同，请求不同的数据渲染页面达到多个页面共同使用 ``` #### 4.3comments商品评论列表 ``` 难点：由于数据请求返回的数据没有过滤，需要分类，数组嵌套，详情见代码 ``` #### 4.4message 消息列表 #### 4.5profile个人中心 #### 4.6contact联系我们 ### 5 未完待续记录自己的坑