Vue
二饭
公众号:全栈开发日记
展开
-
【开发日记】Error: error:0308010C:digital envelope routines::unsupported
Error: error:0308010C:digital envelope routines::unsupported原创 2022-12-18 18:18:55 · 510 阅读 · 0 评论 -
二饭管理系统:轻量级的“若依”管理系统
系统名称:二饭管理系统v1.0系统框架:SpringBoot+Vue目录:1、简介2、版本v1.0内置功能3、核心功能实现讲解1、简介看过若依的项目,稍显臃肿,对于轻量级项目来说大可不必!所以从零开发了这样一套后台系统,它优点在于轻量级,系统除了依赖MySQL之外,无依赖任何外部模块或应用。大多数的后台系统它都可以胜任,由于它是一个单应用的开发模式所以它的优点相对于其他多模块系统来说,它的优点在占用内存少、启动快、运行快、部署简单等。项目地址:https://gitee.com/S原创 2022-02-04 17:17:26 · 3768 阅读 · 1 评论 -
跨域请求常见错误及解决:No ‘Access-Control-Allow-Origin‘ header is present on the requested resource
我的项目是Vue+Boot前后端分离项目。出现标题的错误信息的可能如下:第①种情况 后端没有设置跨域,这里以Boot项目为例,在类上使用如下注解:表示这个类中的方法都可以进行跨域@RestController@RequestMapping("client/recruit")@CrossOriginpublic class RecruitClient { }第②种情况 后端拦截器或过滤器中没有允许该请求方法通过,正确写法如下:拦截器示例response.setHeader("Access-原创 2021-12-14 14:12:28 · 12630 阅读 · 0 评论 -
CSS背景以文本内容截切
背景图片或背景颜色将只显示文字部分,其他部分会隐藏掉。color: transparent;/*文字颜色为透明*/background-clip: text;/*以文字截切背景*/原创 2021-11-28 18:03:40 · 403 阅读 · 0 评论 -
Vue路由懒加载
如果你的Vue项目有多个组件,当打包构建应用时,JavaScript 包会变得非常大,影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块,然后当路由被访问的时候才加载对应组件,这样就更加高效了。路由懒加载的三种写法// 第一种 官方写法const Foo = () => import('./Foo.vue')const router = new VueRouter({ routes: [{ path: '/foo', component: Foo }]})// 第二种原创 2021-11-28 11:16:12 · 358 阅读 · 0 评论 -
图片在盒子中水平垂直居中
盒子css height: 40%; width: 100%; display: flex; justify-content:center; align-items: center;原创 2021-09-19 18:40:26 · 661 阅读 · 0 评论 -
使用calc显示“invalid property value”无效的属性值
函数内calc(100vh - 220px)运算符前后都需要有空格,无空格则是无效的属性值。原创 2021-08-29 22:00:40 · 1207 阅读 · 0 评论 -
Vue main.js文件内修改new Vue()中的属性
如图:原创 2021-08-28 21:34:55 · 557 阅读 · 0 评论 -
SpringBoot后端配置允许自定义header
前言:前后端分离项目,前端传入自定义的header参数对服务器发起请求,但显示跨域错误解决:创建一个拦截器,在拦截器中编辑允许的自定义header,例子如下:public class AdminInterceptor implements HandlerInterceptor { @Override public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handl原创 2021-08-26 20:47:10 · 3986 阅读 · 0 评论 -
文件上传,通过JS预览图片(无需服务器,只在本地进行)
如下使用的Vue项目,普通项目道理一样。// 给文件上传input添加 change事件bgChange(){ let inputDOM = this.$refs.inputer; // input DOM let bg=this.$refs.app; // 要显示图片预览的DOM let file=inputDOM.files[0]; // 文件对象 let reader = new FileReader(); reader.onload = function(e) { let data原创 2021-08-19 15:34:51 · 194 阅读 · 0 评论 -
Vue中设置CSS全局变量,通过JS改变CSS全局变量
设置<style lang="less" scope> :root{ --themeColor:#00D98F; }</style>使用<style lang="less" scope> .test{ background-color: var(--themeColor); }</style>通过JS改变document.documentEleme原创 2021-08-18 17:35:40 · 2101 阅读 · 1 评论 -
Vue Router懒加载
懒加载写法:在router.js中const router=[ {path:'/', redirect:'/index'}, {path:'/index', component: ()=>import('@/components/index')}, {path:'/tiktok', component:()=>import('@/components/tiktok')}];// 路由对象export default new VueRouter({原创 2021-07-30 23:06:25 · 127 阅读 · 0 评论 -
vue-cli4.x请求跨域解决方法
1、项目根目录下新建一个vue.config.js文件,项目创建之初默认没有该文件。2、写入配置module.exports = { publicPath: '/', //这个必须,引入静态资源需要从根路径引入,否则会找不到静态资源 devServer: { port: 8080, // 访问端口 // history模式下的url会请求到服务器端,但是服务器端并没有这一个资源文件,就会返回404,所以需要配置这一项 historyA原创 2021-07-25 22:38:45 · 525 阅读 · 0 评论