微信小程序写一个查看疫苗的页面，在页面里显示疫苗类型、开始预约时间、截止预约时间、疫苗数量，具体wxml、wxss、JavaScript怎么写

以下是一个简单的微信小程序页面示例，用于查看疫苗信息：

wxml：

<view class="container">
  <view class="header">疫苗信息</view>
  <view class="list">
    <view class="item" wx:for="{{vaccineList}}" wx:key="{{index}}">
      <view class="type">{{item.type}}</view>
      <view class="time">{{item.startTime}} ~ {{item.endTime}}</view>
      <view class="quantity">剩余数量：{{item.quantity}}</view>
    </view>
  </view>
</view>

wxss：

.container {
  padding: 20rpx;
}

.header {
  font-size: 24rpx;
  font-weight: bold;
  margin-bottom: 20rpx;
}

.list {
  border: 1rpx solid #ddd;
}

.item {
  padding: 20rpx;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  border-bottom: 1rpx solid #ddd;
}

.type {
  font-size: 28rpx;
  font-weight: bold;
  margin-bottom: 10rpx;
}

.time {
  font-size: 24rpx;
  margin-bottom: 10rpx;
}

.quantity {
  font-size: 24rpx;
}

JavaScript：

Page({
  data: {
    vaccineList: [
      {
        type: "新冠疫苗",
        startTime: "2021-05-01",
        endTime: "2021-06-30",
        quantity: 10000,
      },
      {
        type: "流感疫苗",
        startTime: "2021-09-01",
        endTime: "2021-10-31",
        quantity: 5000,
      },
    ],
  },
});

在这个示例中，我们使用了微信小程序的模板语法 `wx:for` 来循环遍历疫苗列表数据，并将数据展示在页面上。我们还使用了一些基本的 CSS 样式来美化页面。

当我们运行这个小程序时，将会看到一个简单的疫苗信息页面，其中包含了疫苗类型、开始预约时间、截止预约时间和疫苗数量等信息。