【学习打卡】第4天 微信小程序组件data属性

课程名称：微信小程序入门与实战（全新版）

课程章节：微信小程序组件data属性

主讲老师：7七月

课程内容：

今天学习的内容包括：

微信小程序组件的 data 属性。在页面里查巡查传递参数，加载详情数据并填充页面。

data- 后的内容可以自定义：
data-id="{{ postId }}" 可以绑定 postId，将 id 的值传入到文章页面。

data- 命名规则：
1.直接使用 - 连接，例子：data-post-id（推荐）。 
2.驼峰命名，例子：data-postID 但是在微信小程序里所有的大写字母会自动转换为小写。

在页面的onLoad函数获得查询参数 
页面之间参数传递使用URL方式,方法如下：   
1、在页面标签中 标记：    
data-post-id={{item.postId}}
2、在页面js文件中获取Id:   
const pid = event.currentTarget.dataset.Postid;  
xv.navigateTo({       
url:'post-detail/posttail?pid=' + pid;   })  
3、在另外页面接受参数ID    
基于查询pid     
在onLoad:funtion(options){ 
      var pid = options.id;    
   }

课程收获：

今日课程学习时间大约花费 20 分钟，今天学习的内容超过了昨天天。对小程序属性组件有了新的认识，明日继续努力。