<template>
    <div class="message-list">
        消息列表
      <div v-for="message in messageList" :key="message.id" class="message-item">
        <div class="message-content">{{ message.content }}</div>
        <div class="message-time">{{ message.time }}</div>
      </div>
    </div>
  </template>
  
  <script>
  export default {
    props: {
      messageList: Array
    }
  };
  </script>
  
  <style scoped>
  .message-list {
    display: flex;
    flex-direction: column;
  }
  .message-item {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
  }
  .message-content {
    flex: 1;
  }
  .message-time {
    color: #666;
  }
  </style>