微信小程序笔记一

微信小程序笔记一
一、APP.vue配置全局样式
.page {
width: 100%;
height: 100%;
background-color: #F8F8F8;
}
2.css常用样式
横竖排列：display: flex;flex-direction: row;flex-direction: column;

水平居中:flex-direction: row; align-items: center;justify-content: center;

边框角度:border-radius: realSize(30px);

边框线：border: 2px solid #AAAAAA;

自动换行：display: flex;flex-wrap: wrap;

垂直居中:display: flex;flex-direction: column;align-items: center;justify-content: center;
声明样式结构：在style中添加 lang=“scss” scoped ｛｛｛循环嵌套样式｝｝｝
导入样式：@import url(“样式文件名.css”);

选项组：radio-group>label>raidio>text
@change=“定义绑定事件名称” ：datasource数据源=“数组List”

3. 定义三个按钮
<view :class="[‘inv-h’,Inv0?‘inv-h-se’:’’]" @click=“Inv=0” class=“cpBtn”>增加年级
<view :class="[‘inv-h’,Inv1?‘inv-h-se’:’’]" @click=“Inv=1” class=“cpBtn”>增加班级
<view :class="[‘inv-h’,Inv==2?‘inv-h-se’:’’]" @click=“Inv=2” class=“cpBtn”>增加网格长

第一个页面的内容
第二个页面的内容
第三个页面的内容

inv-h-w：背景色，高度
inv-h：flex: 1;未选中时的样式
inv-h-se：选中后的样式