![](https://img-blog.csdnimg.cn/20201014180756754.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端vue3
牛奶味的团子
这个作者很懒,什么都没留下…
展开
-
在组件中显示tuku的照片
(1)错误:域名前面一定要加http://要不然会报错(2)在使用 defineModel传值时一定要动态绑定,要不然图片不显示(3)改完后在商品列表中显示图片信息必须在显示的图片中取第一张图片。原创 2024-07-15 22:07:27 · 315 阅读 · 0 评论 -
统一查询接口
统一接口:在查询时,不同的Api会响应返回不同类型的数据,前端处理起来就比较麻烦,沟通成本也比较高,定义一个productQuery类用来传递请求中的数据。编写查询语句,返回结果集合。原创 2024-07-15 15:58:38 · 156 阅读 · 0 评论 -
分页stater
自定义aop,以添加注解的方法为切入点,对目标方法做一层增强。PageXAutoConfiguration代码。原创 2024-07-15 15:35:24 · 228 阅读 · 0 评论 -
使用base64通用文件上传
编写一个上传文件的组件 tuku,点击图片上传后使用FileReader异步读取文件的内容,读取完成后获得文件名和base64码,调用后端uploadApi,传入姓名和base64文件信息,后端存入nginx中,用于访问。uploadService代码。原创 2024-07-15 14:41:40 · 247 阅读 · 0 评论 -
nigix的下载使用
双击打开nginx的默认端口是80配置文件默认访问页面在目录下新建pages,放入图片在浏览器中输入地址进行访问可以在电脑中配置本地域名。原创 2024-07-13 16:12:22 · 213 阅读 · 0 评论 -
商品详情使用富文本编辑器
2、因为好多页面都需要用到,封装富文本编辑器组件。3、在商品编辑和商品添加页面添加富文本编辑器。Editor.vue代码。原创 2024-07-13 15:31:22 · 202 阅读 · 0 评论 -
vue中父子传递属性值
自定义图库组件在add.vue中应用tuku组件并给默认值效果。原创 2024-07-13 11:56:48 · 324 阅读 · 0 评论 -
编写商品列表和商品编辑和商品新增页面
【代码】编写商品列表和商品编辑和商品新增页面。原创 2024-07-13 10:13:04 · 252 阅读 · 0 评论 -
使用mybatis的statementHander拦截器监控表和字段并发送钉钉消息
因为这个pagehelper是从stater中继承过来的,可以在stater中也加一个4.6版本的jsqlparser依赖。JSqlParser 是一个 SQL 语句解析器。它将 SQL转换为可遍历的 Java 类层次结构。新建mybatis的statementHander拦截器拦截器 类。解析Sql时引入JSqlParser。原创 2024-07-12 11:34:42 · 443 阅读 · 0 评论 -
MyBatis执行流程,JDBC的执行流程,MyBatis拦截器,lastupdateby设置token里的花名
JBDC的底层主要是三个接口对象,Connection、Statement、ResultSet。Connection用于建立与数据库的连接,Statement用于向数据库发送sql语句,ResultSet用于封装sql查询语句的结果。原创 2024-07-11 14:29:34 · 834 阅读 · 0 评论 -
Threadlocal使用获取最后更新人信息
拿到token后放在请求头中发送商品的插入请求,在插入是设置拿到token中的nickName(花名)放入(lastUpdateBy)更新人字段中。在使用的token拦截器stater中,在拦截返回之前装入localUser对象。Threadlocal 的作用范围是一个线程,tomcat启动默认开启一个线程。首先点击登录,登录方法会返回token。编写LocalUser实体类。原创 2024-07-11 09:06:26 · 209 阅读 · 0 评论 -
前端使用pinia中存入的值
导入pinia,创建pinia实例。使用pinia中的值。原创 2024-07-10 21:55:38 · 382 阅读 · 0 评论 -
【无标题】
在页面中引入pinia,并创建实例。Vue解析token中携带的数据。原创 2024-07-10 21:48:46 · 356 阅读 · 0 评论 -
MD5加密和注册页面的编写
register.vue代码。使用Api时每次都要导入。原创 2024-07-10 21:08:32 · 294 阅读 · 0 评论 -
发送手机,邮箱验证码
使用aliyun邮箱作为发件邮箱,需要在邮箱中开启代收功能1、引入依赖userController代码userService代码。原创 2024-07-10 09:14:02 · 351 阅读 · 0 评论 -
pinia的使用
但是并没有生效,是因为Pinia是默认存储在内存中的,当浏览器关闭和刷新时就会消失,可以使用pinia-plugin-persistedstate插件,存储在浏览器中,可以存储在localStore或者时sessionStore中,默认存储在localStore。这个按钮无论上次进来是展开还是折叠,每次进来默认都是展开的,如果想要记录上一次的状态就需要把这个变量存一下,存储在pinia中。Pinia是一个基于Vue 3的状态管理库,它使得管理Vue的全局状态变得更加容易和直观,导出pinia并使用。原创 2024-07-08 20:43:06 · 818 阅读 · 0 评论 -
设计导航栏
二、这样的话我们可以在App.vue首页页面中添加布局并使用Menu组件,然后在Menu组件中使用elementPlues中的菜单组件,可优化路由菜单。打印下router发现存放的是当前显示内容对应的导航栏中的路由,rouer中的path就是当前页面的路径。打印下router变量发现router里面的routes存放的就是我们的路由。在路由中定义一个meta数组用于存储Menu组件中要用到的值。在菜单组件中使用路由,在点击时中间内容区域显示相应的内容。(2)在使用的Menu.vue组件中美化路由。原创 2024-07-08 19:52:49 · 386 阅读 · 0 评论 -
优化路由,优化请求url
把这个url抽出来,新建一个Api文件夹用于存放所有接口的url,在业务里只需要关注业务就可以。如果想要更改路径,在这里直接更改即可。原创 2024-07-06 19:15:27 · 253 阅读 · 0 评论 -
商品分页,商品模糊查询
引入分页定义分页主件的参数在请求url上拼接参数定义改变当前页码后触发的事件,把当前页码的值给到分页表单,重新查询。原创 2024-07-06 15:42:41 · 256 阅读 · 0 评论 -
axios的使用,处理请求和响应,axios拦截器
(2) 每个请求都要考虑,程序报错的情况,都需要catch一下,处理下异常,而且在拿数据时我们后端写了统一返回格式,但是前端响应的数据res里我们的数据被一层一层包裹着,每次都要一层一层的拿,代码冗余。(1) 但是如果发送请求请求时间过长,回出现请求待处理的情况,用户体验很不好,没有画面,我们可以加一个loding遮罩层,提示用户正在加载中,但是如果没个请求都手动添加,代码冗余。新建一个http文件夹,新建index.ts文件用于定义请求和响应拦截器,在请求和响应拦截器中解决以上问题。原创 2024-07-06 10:22:29 · 577 阅读 · 0 评论 -
解决前后端同一个端口跨域问题
如果url是api开头的自动代理访问8080端口(解决前后端端口不一致要么是前端代理,要么是后端加过滤器)原创 2024-07-05 22:10:49 · 427 阅读 · 0 评论 -
使用Element Plus
例如我们使用官方案例中的带小星星的图标,不显示图标,由于Element Plus是图标样式分离的,我们如要使用需要全局安装图标。在main.ts中全局注册ElementPlus并使用。将其类型声明提供给 TypeScript。原创 2024-04-05 12:31:01 · 417 阅读 · 0 评论 -
配置vite配置文件更改项目端口、使用@别名
是 Node.js 的核心模块之一,用于处理文件路径的操作。它提供了一些方法,用于在不同操作系统上正确解析、拼接和转换文件路径,以及获取路径的各个部分(目录名、文件名、扩展名等)。@types/node 包允许您在TypeScript项目中使用Node.js的核心模块和API,并提供了对它们的类型检查和智能提示的支持。比如安装之后,就可以导入nodejs的 path模块,在下面代码。2. 在vite.config.ts里面配置resolve。导入的时候就可以使用@别名导入了。原创 2024-04-03 18:12:38 · 1260 阅读 · 0 评论 -
路由Vue-Router使用
查看安装好的vue-router。原创 2024-04-03 17:40:21 · 377 阅读 · 0 评论 -
通过vite创建项目
1.安装vite: npm install -g vite@latest2.创建项目: npm init vite@latest 项目名称 -- --template vue-ts3. cd 到项目目录之后运行。原创 2024-04-03 16:09:24 · 2328 阅读 · 0 评论 -
NodeJS安装
1. NodeJS官网下载与安装。2. 查看NodeJS安装版本。4.vscode安装。3. 查看npm版本。原创 2024-04-02 00:49:40 · 437 阅读 · 0 评论