前端vue显示柱状图_教育平台项目前端：视频讲解

最新推荐文章于 2023-10-17 19:00:00 发布

安心小鱼

最新推荐文章于 2023-10-17 19:00:00 发布

阅读量103

点赞数

文章标签：前端vue显示柱状图

本文链接：https://blog.csdn.net/weixin_36147808/article/details/112203538

版权

完成课时模块的添加、修改、内容回显的前端页面开发。

前后端接口联调：完成与后台接口的对接，实现对课时内容进行操作。

使用 IntelliJ Idea 打开 edu_work 项目；配置 Tomcat 服务器的部署方式为 war；配置 Tomcat 服务器的本地图片上传目录；运行 lagou_edu_home。

使用 VS Code 打开 edu-boss 项目，然后打卡命令行运行 npm run serve。

分别打包好后台项目和前端项目，然后分别部署到虚拟机中的两个不同的 tomcat 目录中，先运行后台再运行前端项目。

CourseTasks.vue

新增两个按钮：添加课时按钮、编辑课时按钮。
新增一个对话框：对话框中包含一个表单，表单用于显示添加或修改课时的信息。
Vue 的 data 中增加数据：addLessonForm - 跟表单绑定的课时信息 Map 类型；rules - 表单校验规则 Map 类型；showAddLesson - 是否显示对话框的布尔值。
Vue 的生命周期 created 钩子函数中为 addLessonForm 获取课程 id 和课程名。
Vue 的 methods 中新增方法：handleShowAddLessonDialog(section) - 显示添加课时表单，回显课时信息；handleShowEditLessonDialog(lessonNode) - 显示修改课时表单，回显课时信息；handleAddLesson() - 添加 & 修改课时操作。

知乎视频www.zhihu.com

想了解更多，欢迎关注我的微信公众号：Renda_Zhang

关注