【清华大学】学做小程序
https://www.bilibili.com/video/av21987398
2.2创建项目和文件结构
小程序包含一个描述整体程序的app和多个描述各自页面的page
配置app.json,至少含有pages(页面路径列表)
用于指定小程序由哪些页面组成,每一项都对应一个页面的 路径+文件名 信息。文件名不需要写文件后缀,框架会自动去寻找对于位置的 .json, .js, .wxml, .wxss 四个文件进行处理。
数组的第一项代表小程序的初始页面(首页)。小程序中新增/减少页面,都需要对 pages 数组进行修改。
子页面的json文件同样不能为空
[JSON 对象使用在大括号({})中书写。
对象可以包含多个 key/value(键/值)对。
key 必须是字符串,value 可以是合法的 JSON 数据类型(字符串, 数字, 对象, 数组, 布尔值或 null)。
key 和 value 中使用冒号(:)分割。
每个 key/value 对使用逗号(,)分割。
实例
{ "name":"runoob", "alexa":10000, "site":null }]
about.js 出现脚本错误
需要通过调用 page 函数 给 about页面注册 页面对象
在about.wxml测试标签
<text style="font-weight:bold;font-size:30px;">hello world</text>
通过
<text class="info">hello world</text>
通过测试wxss
.info{
font-weight:bold;
font-size:30px;
}
====================================
2.3页面配置初探
顶部导航栏修改通过修改json
{
"navigationBarTitleText":"关于",
"navigationBarBackgroundColor":"#fff",
"navigationBarTextStyle":"black"
}
navigationBarTitleText 导航栏标题文字内容
navigationBarBackgroundColor 导航栏背景颜色,如 #000000
navigationBarTextStyle 导航栏标题颜色,仅支持 black / white
https://developers.weixin.qq.com/miniprogram/dev/framework/config.html#%E5%85%A8%E5%B1%80%E9%85%8D%E7%BD%AE
====================================
2.4view、text、image组件
目标呈现一个图片和三个文本
组件(标签,元素)中可以加入属性class id style bindtap(触发函数) hidden(隐藏(true/false))date- (自定义设置属性(将会在事件触发的时候封装在事件对象中传递给对应的事件处理函数处理))
block和inline这两个概念是简略的说法,完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素)。https://www.cnblogs.com/ry123/p/4322744.html
在html中一般使用div作容器元素,在wxml中使用view元素来替代