基础
index.wxss -- 相当于css,用于控制样式
index.js -- 界面逻辑设计
index.json 页面的配置
index.wxml --页面内容 相当于html
app.wxss属于全局类 任何一个文件都可以使用
index.wxss只有index页面可以使用
一些css
text-transform 可用于控制英文全部大写或者全部小写。
text-align: justify主要用于英文段落,英文段落一般是两端对齐。
white-space: pre-wrap 该空格的地方空格,该换行的地方换行 文档中的空白处
word-spacing 单词间距
letter-spacing 字母之间的距离
wx.createInnerAudioContext() 用于创建音频对象
Flex弹性布局
display:flex;
flex-direction:row // 默认 主轴方向 左右布局
flex-direction:column // 主轴方向 上下布局
事件的参数传递
wxml:
<button bindtap="begin" data-num="1">出去吃啥?</button>
js:
begin:function(e){ var index=e.currentTarget.dataset.num; }
index 为传递的参数num
全局配置
文档地址:https://developers.weixin.qq.com/miniprogram/dev/reference/configuration/app.html#tabBar
图片组件image
<image> 组件默认宽度 300px、高度 225px;
去掉图片的默认宽度:
<image src="/images/pic2.png" mode="widthFix" />
input属性
type的合法值app.json
pages
pages创建路径后,会自动创建文件夹和文件window
设置顶部
tabBar
设置底部导航
页面内部json:index.json
只能设置顶栏的样式
小程序生命周期
小程序初始化onLaunch - 小程序启动onShow - 页面加载onLoad -页面显示onShow -页面渲染onReady -小程序隐藏onHide
网友评论