![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue3
文章平均质量分 50
vue3实战
敲代码的翠花
这个作者很懒,什么都没留下…
展开
-
TypeScript_02
关于 TypeScript 与 JavaScript 中的类语法不是重点,class 相关语法只是起到辅助作用,更重要的是前面讲的 interface。const c1 并没有声明类型为 Cat,但它与 Cat 类型有一样的属性,也可以被当作是 Cat 类型。例如,从服务器返回的一段 JSON,如果不用 typescript,则编辑器也不能给出准确的提示。,把【类型】也当作一个变化的要素,像参数一样传递过来,这样就可以派生出结构相似的新类型。如果需要某个属性可选,可以用下面的语法。注意,需要在编译时加上。原创 2023-10-17 19:17:55 · 25 阅读 · 0 评论 -
vue3-04
定义子组件 Child1父组件引用。原创 2024-01-10 20:01:22 · 346 阅读 · 0 评论 -
TypeScript_01
安装typescript编译器,-g表示全局安装,可以将包或工具安装到全局可用,而不仅仅是在当前项目的目录下。静态类型意味着,在代码运行前,就对它的行为做出预测(make predications about what code is expected before it runs)泛型 T只接受父类型或者父类型的子类,表示T只接受子类型或者子类型的父类。obj类型不确定,就给后期使用者带来了麻烦,一旦参数传不对,代码就崩溃了。原创 2023-10-17 14:38:23 · 33 阅读 · 0 评论 -
vue3-00
打开根目录下 vite.config.ts,原创 2023-10-16 22:13:17 · 54 阅读 · 1 评论 -
vue3-01
技术选型Vue还是✔️还是✔️语法还是✔️构建工具还是✔️路由✔️共享存储还是✔️视图组件还是✔️。原创 2023-10-19 14:53:10 · 57 阅读 · 0 评论 -
vue3-02
执行打包命令会在在项目的/dist/assets目录下生成一个以index开头的js文件,查找console.log,会找到生产环境下的BASE_URL的值。浏览器中有两套 API 可以和后端交互,发送请求、接收响应,fetch API 前面我们已经介绍过了,另一套 API 是 xhr,基本用法如下。后端返回的响应状态码总是200,用自定义错误码表示出错,这时会走响应拦截器第一个箭头函数,用 response.data.code 做分支判断。. 来避免访问不存在的属性。原创 2023-10-19 17:06:17 · 57 阅读 · 0 评论 -
vue3-03
usePagination 只需要定义一次,后续还想用它内部的 axios 发请求,只需调用 run 函数。js 中类似于 18,20 这样以逗号分隔字符串,会在 get 传参时转换为 Java 中的整数数组。data.value 的取值一开始是 undefined,随着响应返回变成 axios 的响应对象。在 src/model/Model8080.ts 中补充类型说明。响应式的 axios 封装,官网地址。一些函数的用法(代码E10.vue)首先安装 vue-request。原创 2023-10-19 18:03:34 · 59 阅读 · 0 评论 -
vue3-04
定义子组件 Child1stringstring?string父组件引用。原创 2023-11-18 20:26:29 · 35 阅读 · 0 评论 -
vue3-05
现在版本是: "ant-design-vue": "^3.2.12"引入 antdv 功能,修改 main.ts。ant-design-vue 组件库插件。原创 2023-11-18 20:45:41 · 171 阅读 · 0 评论 -
vue3-06
Object.assign 是将源对象(参数2)的属性值赋值给目标对象(参数1)的同名属性,效果等价于。saveDto 使用 reactive 包装,是为了解决后续表单校验失效问题。在 request.ts 中对响应消息统一处理。原创 2023-11-18 20:57:53 · 51 阅读 · 0 评论 -
vue3_07
vue-router。原创 2023-11-21 12:51:14 · 231 阅读 · 0 评论 -
vue3-08
a-menu-item 与 a-sub-menu 都必须为 key 属性唯一赋值,否则会产生混乱。借助 antdv 的 layout 组件,可以实现主页【上】【左】【右】布局。mode 属性定义子菜单的展示模式(默认弹出,inline 显示在下方)theme 属性定义菜单的主题(默认亮色主题,dark 为暗色主题)router-link 标签用来切换路由,to 是目标路由的路径。原创 2023-11-21 13:24:26 · 34 阅读 · 0 评论 -
vue3-09
图标组件没有全局绑定,需要 import 之后才能使用。插槽,才能确定图标展示的位置(菜单文字之前)需要动态生成标签的时候,可以考虑使用函数式组件。配置 vite.config.ts。编写一个 Hi.tsx 组件。用 jsx 实现图标组件。原创 2023-11-24 20:27:33 · 405 阅读 · 0 评论 -
vue3-10
因此,服务器返回的路由最好是 main 的子路由,这样重置时就会比较简单,用之前的 main 一覆盖就完事了。vue-router@4 中的 addRoute 方法会【覆盖】同名路由,这是这种实现的关键。后端 API 访问依据,例如每次发请求携带 token,后端需要身份校验的 API 需要用到。前端路由跳转依据,例如跳转前检查 token,如果不存在,表示未登录,就避免跳转至某些路由。addServerRoutes 函数向路由表中添加由服务器提供的路由,路由分成两部分。获取该用户的菜单和路由。原创 2023-11-24 20:41:21 · 1165 阅读 · 0 评论 -
vue3-11
src\router\a6router.ts文件。src\views\A6Login.vue文件。src\views\A6Main.vue文件。原创 2023-12-28 15:10:49 · 681 阅读 · 0 评论 -
vue3-12
vue的程序有一个特点,它是一个单页面的程序,也就是不管组件有多少,路由怎么跳转,最外层的html页面只有一个,也就是项目根路径下的index.html,所有的组件都会包含在这个文件当中。实现思路,在用户登录之前做一个检查,如果登录了,则token是存在的,则放行,访问登录页面,如果没有token,否则则不能访问主页,随后跳转到登录界面,让用户登录。需求是用户如果登录了,可以访问主页,如果没有登录,则不能访问主页,随后跳转到登录界面,让用户登录。在src\router\a6router.ts中编写代码。原创 2023-12-28 16:07:38 · 1165 阅读 · 0 评论 -
vue3-13
token是可以是后端api的访问依据,一般绝大多数时候,前端要访问后端的api,后端都要求前端请求需要携带一个有效的token,这个token用于用户的身份校验,通过了校验,后端才会向前端返回数据,进行相应的操作,如果没有通过校验,后端则做其他处理。要在登录的时候携带合法的token,可以在src\api\request.ts文件中添加请求拦截器,在拦截器中可以对请求进行统一的处理,代码如下。src/main/java/com/lala/AppForServer4.java文件内容如下。原创 2023-12-28 17:36:16 · 877 阅读 · 0 评论 -
vu3-14
第一个需求是在用户登录成功之后,在主页显示用户的真实姓名和性别,这些信息要调用后端API获取数据库里面的信息,第二个需求是点击菜单1,在表单中修改用户信息之后,更新到后端数据库,然后在主页同步更新用户信息。这时候就有一个问题,菜单1对应的组件和主页不在同一个组件,那要在不同组件之间共享数据,就要用到pinia。那怎么如果把A6P1组件里面的姓名和性别修改之后,主页的用户数据也同步更新呢,修改A6P1组件组件代码。安装完之后,修改src\main.ts文件。完成之后,主页显示如下。原main.ts文件。原创 2023-12-28 19:50:30 · 686 阅读 · 0 评论 -
vu3-15
现在把共享数据userInfo和后台数据库数据进行绑定,修改src\store\UserInfo.ts文件。改完之后刷新一下页面,因为不刷新页面,ts代码不会重新加载,然后测试一下。修改A6Main.vue文件。修改A6P1.vue文件。原创 2023-12-28 20:33:41 · 573 阅读 · 0 评论