Study

Introduce

一个用于学习的git文件夹

Files introduction

ReaderMovie 学习用的小程序

总结

使用<template name="xxx">板标签，引入可以复用的页面文件。
1. name 用于定义此模板的名称
2. 在需要使用的页面中，使用<import src='xxxx'> 标签进行引入，在需要使用的页面的位置使用<template is='name' /> 引入使用。
3. 在页面中使用模板文件时，还需要使用data={{item}} 进行数据的赋值。例如：
```
<template  is="postItem" data="{{item}}"></template>
```
在wxss中，使用@import 引入模板样式文件。

在{{item}}中增加3个... 可以使得在模板文件中不用再使用{{item.xxxx}} <template is="postItem" data="{{...item}}"></template> 模板文件：

<template name="postItem">
    <view class="post-container">
        <view class="post-author-date">
            <image class="post-author" src="{{avatar}}"></image>
            <text class="post-date">{{date}}</text>
        </view>
        <text class="post-title">{{title}}</text>
        <image class="post-image" src="{{imgSrc}}"></image>
        <text class="post-content">{{content}}</text>
        <view class="post-like">
            <image class="post-like-image" src="../../images/icon/chat.png"></image>
            <text class="post-like-font">{{collection}}</text>
            <image class="post-like-image" src="../../images/icon/view.png"></image>
            <text class="post-like-font">{{reading}}</text>
        </view>
    </view>
</template>

在<template>中增加tapbind没有效果。需要循环出来数据的时候，可以在<template>外增加一个<view>标签，将点击事件增加到外部的<view>中使用data-xxxx 自定义属性，来获取需要的属性,item用于获取本地数据中的文章的postId属性
```
<view catchtap="onPostTap" data-postId="{{item.postId}}"> 
    <template is="postItem" data="{{...item}}" ></template>
</view>
```
使用even.currentTarget.dataset.xxx来获取自定义属性postId的值 even:框架提供的事件对象; currentTarget:鼠标当前点击的对象; dataset:所有自定义属性的集合; xxx：全部小写例：
```
var postId = even.currentTarget.dataset.postid;
```

注：

引用模板时。可以使用相对路径与绝对路径例：

<import src="post-item/post-item-template.wxml"></import>

zx122248006/ReaderMovie

Study

Introduce

Files introduction

总结