vue
70yyds
去变强吧,少年
展开
-
antd pro中vue-quilleditor富文本编辑器,重写非base64图片上传方法
工作需要用到富文本编辑器,antdpro自带的有两个富文本编辑器,我用的是quilleditor。在上传图片的时候,图片是默认以base64格式上传的,无论是上传还是请求都非常费时,体验极差。于是想要解决这个问题,发现很多人都选择重写上传方法。但是antd的a-upload有一个隐藏的问题先贴上重写的方法代码//html就是一个朴实无华的上传组件,自定义了一下upload事件<template> <div :class="prefixCls"> <a-upl原创 2021-06-09 10:54:25 · 798 阅读 · 0 评论 -
vue v-for横向遍历
** V-for的横向遍历**在循环表格内容的时候一般都是纵向循环列。但是如果在一个多行3列的table里想要按从左到右的顺序就有些困难。此时需要将要循环的数组以3个为分割,分割成多维数组,然后再使用v-for的嵌套循环即可// 这里是html代码<tbody> <tr v-for="(item, index) in riskCategories" :key="index"> <td v-for="(i, j)原创 2021-04-23 11:40:05 · 2589 阅读 · 0 评论 -
put,post的用法区别
put的作用是修改一个对象中的某个字段的内容,所以在传参的时候接口中会都要求传某个id,在调用的时候则需要传一个已经修改过的对象,对象中需要包含这个id,走通之后就会只修改这个字段的值了post则是向数据库中添加某个对象,所以一般不需要接口里添加id...原创 2021-04-16 17:25:18 · 1157 阅读 · 0 评论 -
keep-alive的使用经验
keep-alive的使用经验vue的keepalive可以说是缓存方法里很方便的了,但是有一些场景需要注意一下,简单说一下最常用的两种方法1,在keepalive的include和exclude属性,不赘述了,看官方文档很简单2,在路由文件中的meta里,添加一个属性keepalive:true,然后 <keep-alive v-if="$route.meta.keepAlive"> <router-view /> </keep-alive>原创 2021-04-16 12:08:26 · 184 阅读 · 0 评论 -
关于Antdesign中很多组件的属性可以用slot替换
关于Antdesign中很多组件的属性可以用slot替换刚来公司熟悉项目的时候,发现代码中会大量使用插槽,因为之前学习的时候用插槽都是先定义在引入使用,但是在公司的项目里完全找不到插槽在哪里定义和引用的。今天写代码终于明白了,ant-design是默认可以使用插槽替换组件一些属性的以modal为例,我的modal中没有title属性,但是在下面可以定义一个插槽盒子替换这个属性,并且优先级高于内嵌写的title,就算你再组件里写title也会失效<a-modal width="900px" :v原创 2021-03-24 18:27:02 · 2165 阅读 · 3 评论 -
关于Ant-design中table的使用及数据挂载的问题
关于Ant-design中table的使用及数据挂载的问题其实官方文档中的静态写法已经说明了挂载数据的方法,但是奈何我第一次用- -在:data-source动态绑定数据源之后,用column中的dataIndex指定数据源对象中下的哪一个数组对象,当需要添加按钮和其他操作的时候,可以使用column的scopedSlots: { customRender: ‘checkbox’ }来制定插槽// An highlighted block <a-table原创 2021-03-23 16:51:34 · 1331 阅读 · 0 评论 -
关于ant-design按需导入后全局样式与自定义样式冲突的问题
关于ant-design按需导入后全局样式与自定义样式冲突的问题 这是一个笨法子,之前自己用antdesign写东西,刚开始直接全量引入了,后来改成按需导入发现我的全局样式失效了(主要是一些简单的全局,内外间距0,高度100等等)。 查了一下发现这个问题还很棘手,因为官方好像也没解决这个问题,因为按需引入组件的时候,ant的样式会自动插入到body标签里,所以优先级还很高。找来找去也只找到了用webpack的插件 normal-module-replacement-plugin,可以替换制定文件为另一个原创 2021-03-23 16:23:26 · 995 阅读 · 0 评论 -
axios拦截器添加token验证
axios拦截器添加token验证在每一次的网络请求中都需要使用token来获取对应的用户权限信息。在这里记录一下,在请求时是如何添加token的//axios请求拦截器(预处理这次请求)axios.interceptor.request.use(res=>{//authorization是一个处理头部信息的方法res.header.Authorization=window.sessiontorage.getItem('token') return res//这一步必须}).原创 2021-03-12 14:33:05 · 312 阅读 · 0 评论 -
登录功能路由守卫的用法router.beforeEach(to,from,next)
登录功能路由守卫的用法router.beforeEach(to,from,next)beforeEach有三个回调函数,对应着三个功能,到哪去,从哪来,下一步 if(to.path==='/login') return next(), //获取token window.sessionStorage.getItem('token') //没有token,还是回到login页面 if(!token) return next('/login') next()//一般公司的项目中还需要原创 2021-03-12 11:00:33 · 1828 阅读 · 0 评论