使用Vue开发学生成绩计算网页

一、实验目的

1.掌握HTML基础知识的应用；

2.掌握Vue基本架构的应用；

3.掌握函数方法的定义及使用；

4.掌握methods方法的使用；

5.掌握computed计算属性的使用；

6.实现一个学生成绩计算页面。

二、实验步骤（及实验数据）

在学生成绩录入系统中，在填完所有指定字段（包括"姓名"、"学号"、"课程一（HTML5应用开发）"、"课程二（JavaScript程序设计）"以及"课程三（前端框架（Vue.js）应用开发）"等）之后，在单击该系统中的"添加学生成绩"按钮后，在界面右侧会出现这些记录并展示在学生信息表格中。如果任何一个字段留空，则会在屏幕上出现简单的警示框显示相关信息：例如，在某个字段缺失时会显示提示信息：该字段不可为空。此外，在'课程一（HTML5应用开发）'字段的值超出范围时会显示相应的错误提示：例如，在'课程一（HTML5应用开发）'字段的值超出范围时会显示相应的错误提示：例如，在'课程一（HTML5应用开发）'字段的值超出范围时会显示相应的错误提示。

（2）在学生成绩列表中，具体功能如下：

单击"显示课程三的平均值"按钮后，在表格中新增一行，在该行的"课程三（前端框架（Vue.js）应用"列单元格中计算总分并求平均数

单击显示个人课程平均分按钮，在系统中将对列表中的每个学生的所有课程分别计算其总分并求其算术平均值