【笔记】Vue3回忆录

news/2024/11/18 4:45:19/

下载Element-UI

其语句应为 

npm install element-plus

vue的模块装载

单张视图写完 - 在路由文件router.js中添加视图路径 - 将vue文件装在App.vue中(这一步不是必须的 只在你的视图需要固定待在主页面的时候 其他可切换页面用<router-view>) - 在main.js中导入router组件

前提:已经在router.js中导入视图vue文件(就是已经将页面添加到路由的意思↓)

将写好的vue文件加载到App.vue中 

加载的方式就是<页面的导出名字/>(导出方法有script中setup和export default 自定义导出名字)↓

组件名对应:

最后:在main.js导入router文件 也就是实现router路由

这一步只需要做一次 接下来的子页面们都直接装载(导入)在router.js中

在需要和后端交互的vue页面都需要导入request的js

请求的内容为

然后在api接口这里用到request的js

也可以这样写

最后这样写了

最后将api导入到起点 视图.vue

总结:

——————————————————分割线————————————————————

Style中的scoped是防止溢出渲染到其他页面的css

script中的setup就是export default{ } 二者只能留一个

setup时候的数据状态 可以直接将数据与绑定const定义静态变量名

export default时数据状态

?好像都可以

whatever

登录后跳转到首页:

前端在api里对应后端controller中的/user/login


http://www.ppmy.cn/news/1547901.html

相关文章

c# Encoding.GetEncoding

Encoding.GetEncoding 是 C# 中的一个方法&#xff0c;它用于获取特定名称的编码的 Encoding 对象。如果指定的编码名称不存在&#xff0c;则会抛出 ArgumentException。 获取 UTF-8 编码&#xff1a; Encoding encoding Encoding.GetEncoding(“utf-8”); 获取 ASCII 编码…

WebKit的Windows接口(适用2024年11月份版)

WebKit的Windows接口 使用cairo作为图形后端&#xff0c;libcurl作为网络后端。并且它只支持64位的Windows。 安装开发工具 安装带有“使用c进行桌面开发”工作负载的最新Visual Studio。 Activate Developer Mode.激活开发者模式。Build-webkit脚本创建一个指向生成的comp…

ZooKeeper单机、集群模式搭建教程

单点配置 ZooKeeper在启动的时候&#xff0c;默认会读取/conf/zoo.cfg配置文件&#xff0c;该文件缺失会报错。因此&#xff0c;我们需要在将容器/conf/挂载出来&#xff0c;在制定的目录下&#xff0c;添加zoo.cfg文件。 zoo.cfg logback.xml 配置文件的信息可以从二进制包…

hive表名重命名、rename重命名

文章目录 一、重命名表的语法二、重命名遇到的坑2.1、重命名后重建原先的表报表已存在 一、重命名表的语法 在Hive中&#xff0c;重命名表的语法如下&#xff1a; ALTER TABLE table_name RENAME TO new_table_name;示例&#xff1a;alter table user rename to user_bak;注意…

Python学习27天

字典 dict{one:1,two:2,three:3} # 遍历1&#xff1a; # 先取出Key for key in dict:# 取出Key对应的valueprint(f"key:{key}---value:{dict[key]}")#遍历2&#xff0c;依次取出value for value in dict.values():print(value)# 遍历3&#xff1a;依次取出key,value …

Linux自定义终端提示符

转移大全&#xff08;echo -e "\a"等&#xff09; 序列 显示值 \a 以 ASCII 格式编码的铃声 . 当遇到这个转义序列时&#xff0c;计算机会发出嗡嗡的响声。\d 以日&#xff0c;月&#xff0c;天格式来表示当前日期。例如&#xff0c;“Mon May 26.”\h 本地机的…

__VUE_PROD_HYDRATION_MISMATCH_DETAILS__ is not explicitly defined

VUE_PROD_HYDRATION_MISMATCH_DETAILS 未明确定义。您正在运行 Vue 的 esm-bundler 构建&#xff0c;它期望这些编译时功能标志通过捆绑器配置全局注入&#xff0c;以便在生产捆绑包中获得更好的tree-shaking优化。 Vue.js应用程序正在使用ESM&#xff08;ECMAScript模块&#…

Spring Boot编程训练系统:性能优化实践

摘要 随着信息技术在管理上越来越深入而广泛的应用&#xff0c;管理信息系统的实施在技术上已逐步成熟。本文介绍了编程训练系统的开发全过程。通过分析编程训练系统管理的不足&#xff0c;创建了一个计算机管理编程训练系统的方案。文章介绍了编程训练系统的系统分析部分&…