uni-app系列(三)

2019-12-21  本文已影响0人  笑红尘123

文章内容:uni-app生命周期和模版语法

uni-app 支持如下页面生命周期函数:
onLoad 监听页面加载,其参数为上个页面传递的数据,参数类型为object(用于页面传参),参考示例
onShow 监听页面显示
onReady 监听页面初次渲染完成
onHide 监听页面隐藏
onUnload 监听页面卸载
onPullDownRefresh 监听用户下拉动作
onReachBottom 页面上拉触底事件的处理函数
onShareAppMessage 用户点击右上角分享 微信小程序
onPageScroll 监听页面滚动
onTabItemTap 当前是 tab 页时,点击 tab 时触发。

<script>
export default {
 data: {
  msg: 'Hello'
 },
 onLoad:function(options){
  console.log("onLoad");
 },
 onHide:function(){
  console.log("onHide");
 },
 onShow:function(){
  console.log("onShow");
 }
}
</script>

数据绑定
变量赋值

<script>
export default {
 data: {
  title: 'Hello',
 }
</script>

视图渲染数据:

<template>
 <view class="content">
  <view>
   {{title}}
  </view>
 </view>
</template>

数组形式的数据绑定:

<tamplate>
       <view>
             {{list[0]['name']}}
             {{list[0].name}}
       </view>
</template>
<script>
    export default{
         data: {
                list : [
                       {name : "张三", age : 18},
                       {name : "李四", age : 20}
                  ]
 }, 
    }
</script>
上一篇 下一篇

猜你喜欢

热点阅读