|-- server
    |-- api //Имя по умолчанию не может быть изменено
        |-- login.post.ts //опубликовать и получить имя файла Представляет тип полученного запроса.
        |-- userInfo.get.ts // здесь представляет собой запрос на получение
        |-- detail
            |--[id].get.ts  //С динамической маршрутизацией Метод передачи параметров вводит параметры

// Исправлен возврат метода defineEventHandler.
export default defineEventHandler(event => {
    // Принятые события Содержит узел запрос и метод разрешения
  const query = getQuery(event) // getQuery — это глобальный метод, который можно вызывать напрямую.
  const { id } = query
  return {
    msg: `Запрос Личная информация ${id}`
  }
})

{
    msg: `Запрос 23 личная информация`
}

// Исправлен возврат метода defineEventHandler.
export default defineEventHandler(async event => {
  const body = await readBody(event) //readBody — это глобально инкапсулированный метод получения тела
  const { username, password } = body
  //Определяем параметры, которые нужно передать Данные пусты, и сообщается об ошибке.
  if (!username || !password) {
    // createError может напрямую выдавать ошибки
    throw createError({
      statusCode: 400,
      statusMessage: «Имя пользователя и пароль не могут быть пустыми»
    })
  }
  //Операции с базой данных
  return {
    mes: `Данные ${username} успешно сохранены, вход выполнен успешно`
  }
})

<template>
  <div class="mod-login">
    <el-form
      ref="ruleFormRef"
      :model="ruleForm"
      :rules="rules"
      label-width="120px"
      class="demo-ruleForm"
      :size="formSize"
      status-icon
    >
      <el-form-item label="User Name" prop="name">
        <el-input v-model="ruleForm.name" placeholder="Please User Name" />
      </el-form-item>
      <el-form-item label="Password" prop="name">
        <el-input
          v-model="ruleForm.password"
          type="password"
          placeholder="Please input password"
          show-password
        />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="submitForm(ruleFormRef)"> Create </el-button>
        <el-button @click="resetForm(ruleFormRef)">Reset</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script setup lang="ts">
import { reactive, ref } from 'vue'
import type { FormInstance, FormRules } from 'element-plus'

interface RuleForm {
  name: string
  password: string
}

const formSize = ref('default')
const ruleFormRef = ref<FormInstance>()
const ruleForm = reactive<RuleForm>({
  name: '',
  password: ''
})

const rules = reactive<FormRules<RuleForm>>({
  name: [
    { required: true, message: 'Please input username', trigger: 'blur' },
    { min: 3, max: 5, message: 'Length should be 3 to 5', trigger: 'blur' }
  ],
  password: [
    { required: true, message: 'Please input password', trigger: 'blur' },
    { min: 8, max: 15, message: 'Length should be 8 to 15', trigger: 'blur' }
  ]
})

const submitForm = async (formEl: FormInstance | undefined) => {
  if (!formEl) return
  await formEl.validate(async (valid, fields) => {
    if (valid) {
      const { data } = await useLazyFetch('/api/login', {
        method: 'post',
        body: JSON.stringify({
          // параметры запроса публикации
          username: ruleForm.name,
          password: ruleForm.password
        })
      })
    } else {
      console.log('error submit!', fields)
    }
  })
}

const resetForm = (formEl: FormInstance | undefined) => {
  if (!formEl) return
  formEl.resetFields()
}
</script>

<style lang="scss">
.mod-login {
  padding: 300px;
}
</style>

{
    "__v_isShallow": false,
    "__v_isRef": true,
    "_rawValue": {
        "mes": «Данные sejas успешно сохранены, вход выполнен успешно»
    },
    "_value": {
        "mes": «Данные sejas успешно сохранены, вход выполнен успешно»
    }
}

export default defineEventHandler(event => {
  // здесь прошел event.context.params.id, чтобы получить идентификатор ценить
  const id = event.context.params?.id
  return {
    msg: `Запрос Подробная информация о ${id}`
  }
})

// Исправлен экспорт метода defineEventHandle.

export default defineEventHandler(async event => {
  // здесь прошел event.context.params.id, чтобы получить идентификатор ценить
  const id = event.context.params?.id
  // Я позвонил сюда Только что написанная информация о пользователе интерфейс, содержимое, возвращаемое в это время, 
  //  msg: `Запрос 23 личная информация`
  // Можно использовать parseCookies напрямую получает файл cookie клиента
  const cookie = parseCookies(event)
  const res = await $fetch(`/api/userInfo?id=${id}`)
  return res
})