当前位置: 首页 > news >正文

外卖前端Day1.2 (路由,vuex共享数据,typescript)

Vue-Router介绍

基于Vue Cli创建带有路由功能的前端项目

效果展示

router小结

路由配置

路由组成

VueRouter

<router-link>

<router-view>

路由路径配置路径跳转哪个渲染组件,index.js

维护路由表,某个路由路径对应哪个视图组件

动态导入对应请求的渲染组件

总图

路由跳转

标签式(上面就是)
编程式

路由请求路径不存在,如何处理

小结

渲染组件都是在APP.vue中动态的去替换

嵌套路由

普通

实现步骤

小结

状态管理

vuex介绍

vuex核心概念

(就是状态管理的一个库)

vuex的使用方式

简单例子,定义和展示共享数据

修改共享数据(mutations中)

在actions中定义函数,用于调用

小结

TypeScript

typescript介绍

简单体验一下ts(有一定的约束)

为什么TS要增加类型支持

ts小结


TS中的常用类型

创建支持typescript,router,vuex的前端工程

类型标注的位置

字符串类型、数字类型、布尔类型

注意终端打开文件目录位置要在要编译的ts文件目录下

下面就是上面代码编译后的js文件

字面量类型

(类似Java中的枚举)

interface类型

class类-基本使用

这些类编译成js文件后就编程function方法了

类的继承

小结

http://www.jsqmd.com/news/518676/

相关文章:

  • 吐血推荐!全学科适配的AI论文神器 —— 千笔AI
  • Vue项目实战:用Luckysheet打造企业级Excel在线编辑器(附完整代码)
  • Java对象内存分配全解:从new Student()到this关键字,一张图看懂对象在内存中的完整生命周期
  • 基于Python的仿淘宝系统毕设
  • VS2022+PCL环境配置避坑指南:vcpkg一键安装后这些细节要注意
  • Go 语言的“刻意贫穷“:为什么宁可写 30 行选项模式,也拒绝默认参数?
  • c语言第一次作业
  • Python豆瓣图书数据可视化平台 Flask框架 可视化 爬虫 书籍 大数据 机器学习 计算机毕业设计(建议收藏)✅
  • Seurat单细胞测序实战:从原始数据到细胞亚群注释的完整流程解析
  • Vue3 + TS项目上线后,如何用20行代码优雅地提醒用户刷新页面?
  • 批量读取Excel生成.mat矩阵
  • 基于Python的农业设备租赁系统毕业设计源码
  • 领航追随法:车辆编队的智慧指挥官
  • 五次多项式与改进Sigmoid混合曲线融合的平行泊车路径规划代码,克服双重缺陷,满足曲率约束条件
  • 卫星轨道六要素详解:从火箭残骸到GPS卫星的追踪原理
  • 避坑指南:Xcode 15下OC与Swift混编的5个常见编译错误及修复方法
  • YOLOv8改进之Involution:反转卷积思想,核在空间上共享但在通道上特异,减少冗余
  • AI 辅助编程革命:如何利用 GitHub Copilot 等工具重塑开发效率
  • 光伏锂电池储能功率协调控制系统仿真 [1]左侧光伏Boost控制部分:采用扰动观察法来进行MP...
  • Pollinations.AI 免费文生图实战:5分钟搞定自定义图片生成(附完整API参数指南)
  • 基于vue+python智能医疗辅助就诊系统
  • 手把手教你用Gitee+奇安信代码卫士扫描Java-sec-code靶场(含详细漏洞修复指南)
  • 计算机毕业设计:Python图书数据可视化分析系统 Flask框架 可视化 爬虫 书籍 大数据 机器学习(建议收藏)✅
  • ESP32以太网配置门户库:W6100+ConfigPortal一体化方案
  • YOLOv8改进系列:C2f模块全面升级——从C2f到C2f-Faster、C2f-DCN的高效变体实战
  • 基于Webots的轮腿机器人仿真模型:包括轮足设计、PID运动控制及运动学逆解算法,支持多种动...
  • SQLMap Tamper脚本开发指南:从修改到编写你的第一个绕过脚本
  • 分享创业失败后加入格行科技随身WiFi代理项目的成功经验,介绍代理邀请码888886的优势与机遇 - 格行招商部总监张总
  • ArcScene点云可视化进阶:如何自定义RGB颜色映射打造专业级三维效果
  • GhostConv:YOLOv8 的轻量化利器,通过廉价线性变换实现高效目标检测