山东大学 创新项目实训 雅思口语老师（3）

主要任务：搭建雅思ai口语老师前端框架，初步完成接口

一、搭建脚手架

脚手架大致如上初步具备一个基本项目前后端，数据库，本次主要针对前端，使用vue进行开发

二、搭建步骤
1 、设置本地化端口

axios.defaults.baseURL = 'http://localhost:8080'
2、vue内容撰写

①复习知识

v-bind 属性绑定指令

通过 v-on 绑定的事件处理函数，需要在 methods 节点中进行声明

DOM:(Document Object Model)即文档对象模型。是W3C定义的访问文档的标准,他允许程序动态地访问、更新文档的内容、结构和样式

②提示语

③菜单和主体

菜单颜色的宽度

底端录音按钮

总结
初步完成前端的设计，初步模拟图如下，期望用户可以录音发言，后端给予反馈