Recientemente estuve trabajando en un sistema de inicio de sesión para que los maestros asistieran a clases, y finalmente decidí usar el subprograma WeChat para completarlo. Hoy resumiré la encuadernación de la lista.
Función: la página que hice es para mostrar la lista de clases, por lo que el fondo devuelve un teachclassList
El efecto final se muestra en la siguiente figura:
Código de página Wxml:
<view class="touch-item {
{
item.isTouchMove ? 'touch-move-active' : ''}}" data-index="{
{
index}}" style="display:flex;" bindtouchstart="touchstart" bindtouchmove="touchmove"
wx:for="{
{
items}}" wx:key=""
bindtap="detail" data-id="{
{
item.teachClassId}}">
<!-- 左侧图片 -->
<view class="content content-left">
<image src="/images/heart249.png" style="width:50px;height:50px;" mode='aspectFill'></image>
</view>
<!-- 右侧区域：上：课程；下：教师名称 -->
<view class="content content-right" >
<view >班名：{
{
item.teachclassName}}</view>
<view >班号：{
{
item.teachclassCode}}</view>
<view >教师：{
{
item.teacherName}}</view>
</view>
<!-- <view class="del" catchtap="del" data-index="{
{
index}}">删除</view> -->
</view>código js
//根据教师id，查询上课班
getTeachClass: function () {
var that = this;
wx.request({
url: 'https://dmsdbj.com/sign-web/sign/queryTeachclassInfo/' + wx.getStorageSync('userId'),
header: {
'content-type': 'application/json'
},
success: function (res) {
console.log(res.data);
that.setData({
items: res.data.data
});
}
})
},