位置: IT常识 - 正文
推荐整理分享小满nestjs(第二十七章 nestjs typeOrm关系)(小满内容),希望有所帮助,仅作参考,欢迎阅读内容。
文章相关热门搜索词:请问一下小满是什么,请问一下小满是什么,小满是啥呀,请问一下小满是什么,小满是啥呀,小满 2021,小满 2021,小满2020,内容如对您有帮助,希望把文章链接给更多的朋友!
在我们开始的过程中,肯定不会把数据存在一个表里面,我们会进行分表,把数据分开存,然后通过关联关系,联合查询。
typeOrm 文档 一对一 | TypeORM 中文文档
前端代码还是复用上一章的 增加了一个添加Tag
<template> <div class="wraps"> <div> <el-input v-model="search.keyWord" style="width:300px;"></el-input> <el-button @click="init" style="margin-left:10px;">搜索</el-button> <el-button @click="openDialog" type="primary" style="margin-left:10px;">添加</el-button> </div> <el-table border :data="tableData" style="width: 100%;margin-top: 30px;"> <el-table-column prop="name" label="名字" /> <el-table-column prop="desc" label="描述" /> <el-table-column prop="id" label="id" /> <el-table-column> <template #default="scope"> <el-button @click="edit(scope.row)">编辑</el-button> <el-button @click="deleteRow(scope.row)">删除</el-button> <el-button @click="(isShowTag = true,row = scope.row)">添加tag</el-button> </template> </el-table-column> </el-table> <el-pagination @current-change="change" style="float:right;margin-top:10px;" background layout="prev, pager, next" :total="total" /> </div> <el-dialog v-model="dialogVisible" title="弹框" width="50%"> <el-form :model="form"> <el-form-item prop="name" label="名称"> <el-input v-model="form.name" placeholder="名称" /> </el-form-item> <el-form-item prop="desc" label="描述"> <el-input v-model="form.desc" placeholder="描述"> </el-input> </el-form-item> </el-form> <template #footer> <span class="dialog-footer"> <el-button @click="close">关闭</el-button> <el-button type="primary" @click="save"> 保存 </el-button> </span> </template> </el-dialog> <el-dialog v-model="isShowTag" title="添加tag"> <el-select style="width:100%" v-model="tags" multiple> <el-option value="tag1">tag1</el-option> <el-option value="tag2">tag2</el-option> <el-option value="tag3">tag3</el-option> </el-select> <template #footer> <el-button @click="addTa" type="primary">确定</el-button> </template> </el-dialog></template><script setup lang='ts'>import { ref, reactive } from 'vue'import type { FormInstance } from 'element-plus'import { addUser, updateUser, delUser, getList, addTags } from '@/server'const isShowTag = ref<boolean>(false)const tags = ref<string[]>([])const total = ref<number>(0)const row = ref<{ id?: number, name?: string, desc?: string, createTime?: Date}>({})const addTa = async () => { const res = await addTags({ tags: tags.value, userId: row.value.id }) isShowTag.value = false; tags.value = [];}//搜索框const search = reactive({ keyWord: "", page: 1, pageSize: 10})//表单const form = reactive({ name: "", desc: "", id: 0})//清空数据const resetForm = reactive({ ...form })//表格数据const tableData = ref([])//弹框开关const dialogVisible = ref<boolean>(false)const openDialog = () => { dialogVisible.value = true; Object.assign(form, resetForm)}//初始化表格数据const init = async () => { const list = await getList(search) tableData.value = list?.data ?? []; total.value = list?.total ?? 0}init()const change = (page) => { search.page = page; init()}//保存 和修改 表格数据const save = async () => { if (form.id) { await updateUser(form) } else { await addUser(form) } close() init()}//删除表格数据const deleteRow = async (row) => { await delUser({ id: row.id }) init()}//获取 详情const edit = (row: any) => { dialogVisible.value = true; Object.assign(form, row)}//关闭弹框const close = () => { dialogVisible.value = false;}</script><style lang='less'>* { padding: 0; margin: 0;}html,body { background: #ccc;}.wraps { height: 100vh; padding: 30px;}</style>新增了一个接口
import axios from 'axios'axios.defaults.baseURL = 'http://localhost:3000'export const addUser = (data) => axios.post('/user',data).then(res => res.data)export const getList = (data) => axios.get('/user',{params:data}).then(res => res.data)export const delUser = (data) => axios.delete(`/user/${data.id}`).then(res => res.data)export const updateUser = (data) => axios.patch(`/user/${data.id}`,data).then(res => res.data)//添加tagexport const addTags = (data) => axios.post(`/user/add/tags`,data).then(res => res.data)后端Nestjs
1.新建一个 tags.entity.ts
定义Tags的数据表
import { Column, Entity, PrimaryGeneratedColumn, BeforeInsert, CreateDateColumn, Generated, OneToOne, JoinColumn, ManyToOne } from 'typeorm'import { User } from './user.entity'@Entity()export class Tags { @PrimaryGeneratedColumn() id: number @Column() tags:string @ManyToOne(()=>User,(user)=>user.tags) @JoinColumn() user:User}Modal 需要关联tag表
import { Module } from '@nestjs/common';import { UserService } from './user.service';import { UserController } from './user.controller';import {TypeOrmModule} from '@nestjs/typeorm'import { User } from './entities/user.entity';import { Tags } from './entities/tags.entity';// import { example } from './entities/tags.entity';@Module({ imports:[TypeOrmModule.forFeature([User,Tags])], controllers: [UserController], providers: [UserService]})export class UserModule {}然后user表跟tags表进行关联
import { Column, Entity, PrimaryGeneratedColumn, BeforeInsert, CreateDateColumn, Generated, OneToOne, JoinColumn, OneToMany } from 'typeorm'import { Tags } from './tags.entity'@Entity()export class User { @PrimaryGeneratedColumn() id: number @Column({ type: "varchar", length: 255 }) name: string @Column({ type: "text" }) desc: string @Generated('uuid') uuid: string @CreateDateColumn({ type: "timestamp" }) createTime: Date @OneToMany(() => Tags, (tags) => tags.user) tags:Tags[] // example: example}这儿我们解释一下 OneToMany 和 ManyToOne的用法
对于用户来说一个用户可以拥有多个tag 他们的关系是一对多 OneToMany
对于tag来说他们是多个tag指定单个用户 所以是 ManyToOne
OneToMany 接受两个参数
第一个参数是个函数返回关联的类 所以在user表关联tag
第二个参数 创建双向关系
ManyToOne 用法一样
@OneToMany(() => Tags, (tags) => tags.user)保存该关系
沿用上一章的代码增加Controller 增加 addTags
import { Controller, Get, Post, Body, Patch, Param, Delete, Query } from '@nestjs/common';import { UserService } from './user.service';import { CreateUserDto } from './dto/create-user.dto';import { UpdateUserDto } from './dto/update-user.dto';@Controller('user')export class UserController { constructor(private readonly userService: UserService) {} @Post('/add/tags') addTags (@Body() params:{tags:string[],userId:number}) { return this.userService.addTags(params) } @Post() create(@Body() createUserDto: CreateUserDto) { return this.userService.create(createUserDto); } @Get() findAll(@Query() query:{keyWord:string,page:number,pageSize:number}) { return this.userService.findAll(query); } @Patch(':id') update(@Param('id') id: string, @Body() updateUserDto: UpdateUserDto) { return this.userService.update(+id, updateUserDto); } @Delete(':id') remove(@Param('id') id: string) { return this.userService.remove(+id); }}service 增加 addTags 方法
import { Injectable } from '@nestjs/common';import { CreateUserDto } from './dto/create-user.dto';import { UpdateUserDto } from './dto/update-user.dto';import { Repository, Like } from 'typeorm';import { InjectRepository } from '@nestjs/typeorm';import { User } from './entities/user.entity';import { Tags } from './entities/tags.entity';// import { example } from './entities/tags.entity';@Injectable()export class UserService { constructor( @InjectRepository(User) private readonly user: Repository<User>, @InjectRepository(Tags) private readonly tag: Repository<Tags> ) { }//通过前端传入的userId 查到当前id 的用户信息,然后拿到前端传入的tags [tag1,tag2,tag3]// 进行遍历 给tag实例进行赋值 然后调用保存方法添加tag 添加完之后 通过 tagList 保存该tag类// 最后把tagList 赋给 user类的tags属性 然后重新调用save 进行更新 async addTags (params:{tags:string[],userId:number}) { const userInfo = await this.user.findOne({where:{id:params.userId}}) const tagList:Tags[] = [] for (let i = 0;i<params.tags.length;i++) { let T = new Tags() T.tags = params.tags[i]; await this.tag.save(T) tagList.push(T) } userInfo.tags = tagList; console.log(userInfo,1) return this.user.save(userInfo) } async create(createUserDto: CreateUserDto) { const data = new User() // const ex = new example() data.name = createUserDto.name data.desc = createUserDto.desc // await this.example.save(ex) return this.user.save(data) } async findAll(query: { keyWord: string, page: number, pageSize: number }) { const data = await this.user.find({ //查询的时候如果需要联合查询需要增加 relations relations:['tags'], where: { name: Like(`%${query.keyWord}%`) }, order:{ id:"DESC", }, skip: (query.page - 1) * query.pageSize, take: query.pageSize }) const total = await this.user.count({ where: { name: Like(`%${query.keyWord}%`) }, }) return { data, total } } update(id: number, updateUserDto: UpdateUserDto) { return this.user.update(id, updateUserDto) } remove(id: number) { return this.user.delete(id) }}
如果需要联合查询需要增加 relations 注意看上面的代码
下一篇:前端使用lottie-web,使用AE导出的JSON动画贴心教程(前端使用vue)
友情链接: 武汉网站建设