课程名称：Spring Boot+Vue3前后端分离，实战wiki知识库系统

章节名称：8-12 文档页面功能开发-2

讲师姓名：甲蛙

文档内容：

- 8-2 文档表设计与代码生成

简单的树型结构的设计，使用parent列，标识父节点

- 8-4 使用树形选择组件选择父节点

a-tree-select树形选择组件的使用

递归算法

数组操作：unshift, shift, push, pop

8-5 Vue页面参数传递完成新增文档功能

使用route来获取当前路由的信息

import { useRoute } from 'vue-router'

const route = useRoute();
console.log("路由：", route);
console.log("route.path：", route.path);
console.log("route.query：", route.query);
console.log("route.fullPath：", route.fullPath);
console.log("route.param：", route.params);
console.log("route.name：", route.name);
console.log("route.meta：", route.meta);
路由url参数传递的两种方法
/admin/doc?ebookId=xxx
/admin/doc/xxx

- 8-6 增加删除文档功能

树枝的删除，可以将递归算法放到前端

重要的操作增加二次确认

- 8-7 增加删除文档功能

概念：富文本

在Vue中集成富文本框插件wangeditor

v-modal在第一次显示的时候才会创建modal元素，所以初始要去找modal里的元素是找不到的

- 8-8 文档内容表设计与代码生成

代码编辑区域，绿色表示代码新增，蓝色表示代码修改

大字段放在单独的表里

- 8-9 文档管理页面布局修改

概念：响应式设计

如果要做前端，建议学习Bootstrap

栅格系统的使用

默认展开表格树需要配合上v-if

- 8-10 文档内容的保存

使用editor.txt.html()获取内容

使用editor.txt.html(xxx)设置内容

- 8-11 文档内容的显示

Mybatis-Generator生成的列：

Base_Column_List：基本类型字段

Blob_Column_List：大文本类型字段

- 8-12 文档页面功能开发

树形组件a-tree的使用

通过Checkout操作，可以回到以前的提交点，运行当时的代码程序

新加的样式，不要影响页面其它内容，给目标区域加个特定的样式名字，如课程中用的class=“wangeditor”

使用!important提高样式的优先级

style里加了scoped属性，表示里面的属性只在当前页面有用，不加scoped的话，则是全局起作用

抽屉组件a-drawer的使用

总结：

这里就是复习一下这一大章的内容，将知识点总结一下，总结都在上面了。