3.uniapp入门

1.样式单位

1.单位是小程序的rpx
2.字体也可以用font-size:30rpx

2.导入样式文件(在style中写)

@import url("./xxx.css");

3.uniapp样式不能用*,page相当于body

4.局部样式覆盖全局样式

5.使用字体图标

  1.小于40kb,自动转换为base64格式
   2.大于40kb需要转换
   3.字体文件推荐使用(兼容)(全部文件都需要改)
      @font-face{
         font-family:text1;
         src:url('~@/static/iconfont.ttf'); //代表使用uniapp的默认路径

     }

4.全局的在 app.vue @import

6.使用scss
工具–>安装工具
在style写

<style lang="scss">
  @import url('xxx.css');
   .box1{
     background: $global-color;   //使用uniapp的全局变量
   

    }
</style>

7.数据绑定和vue一样

  {'1'+1}
  {{flag?'xxx':'yyy'}}

8.for

person:[{},{}]
  v-for"(item,index) in arr" :key="item.id"  //不是wx:key,(微信会警告)

9.绑定事件

  v-on:click="xxx()"  methods:  xxx(e){}//默认的对象
  v-on:click="xxx(20,$event)"  methods:  xxx(num,e){}//拿到默认的对象
  @click //简写

10.uniapp应用的生命周期(必须定义在App.vue)

onLaunch 初始化后,只触发一次
onShow   启动,后台进入前台(谷歌浏览器切到后台)
onHide    后台进入前台
onError(e)   报错时

11.页面的生命周期

 onLoad(options) 页面加载,options可以拿到上一个页面传过来的数据
 onShow多次触发 tabbar有缓存
 onReady 页面渲染完成
 onHide
 onUnload 卸载