Aaron Con-CSDN博客

对于部分网站来说，首先呈现的就是登录页面，所以登录页面的功能实现非常重要思想：对于不同页面内容的实现,我们需要通过router来实现，首先我们得定义我们所需要的路由，例如/login，/404, / 等定义了相关路由，我们得让我们刚访问地址的时候根据不同的条件展示是否为登录页。所以我们需要设置路由守卫，我们这里以token来判断。如果我们登录过并且登录成功，我们在发送请求成功后，后端会将一个token返回给我们，我们会将这个token存储到vuex中，同时也存储到浏览器的cookie中。.

2022-04-13 21:45:14 833

原创 nginx配置

前端项目上线，nginx的跨域配置

2022-04-12 12:30:15 2558

原创使用screenfull插件报错问题

我们实现全屏功能可以直接手写方法，但利用screenfull插件来处理全屏的问题非常方便，但是今天正常使用遇到个bug安装npm包npm i screenfull默认的是最新版本导入import ScreenFull from 'screenfull'使用正常使用全屏功能ScreenFull.toggle()这时候就给我报错了出现页面空白加载不出来的情况，我去网上找了几篇文章都说是版本太高，需要降低包插件的版本，我尝试了多次依旧报错解决的确要降低版本，我降到得是screen.

2022-04-10 01:02:29 2600 2

原创全屏和退出全屏

全屏document.documentElement.requestFullscreen()退出全屏document.exitFullscreen()

2022-04-09 23:15:11 348

原创使用/deep/报错css(css-selectorexpected)

我们在对应用的UI组件库进行样式的更改时, 通常会用到/deep/这个深度作用选择器，但是今天使用出现了个报错，尽管不影响样式，但是它在终端一直显示着报错看着就很烦躁解决方案：将/deep/改成 ::v-deep就能解决...

2022-04-09 18:20:41 2704 1

原创配置阿里云Oss

目标：配置一个阿里云Oss我们找一个可以免费上传图片的服务器，帮我们代管图片，我们在自己的数据库里只保存一个地址就行，这其实也是很多项目的处理方案，会有一个公共的文件服务器注册阿里云并认证阿里云官网这里先进行注册并且认证，只有认证后才能使用阿里云的有关服务找到存储产品中的对象存储oss，并且开通该服务在列表中Bucket列表下创建Bucket填下Bucket名称，选择地域,以及根据自己需求选择读写权限和加密方式非对创建的Bucket存储列表进行跨域设置...

2022-04-06 19:45:20 1106

原创动态组件＜component :is=‘‘＞＜/component＞

vuejs中内置了一个组件component,使用它可以动态切换组件// template<button @click="UseComponent = 'component-two'">切换为ComponentTwo</button><button @click="UseComponent = 'component-one'">切换为ComponentOne</button><component :is="UseComponent" /&gt.

2022-04-06 16:51:22 513

原创在使用xlsx.js导入文件报错Error: Cannot read properties of undefined (reading ‘read‘) at FileReader.read

在项目中想要实现一个成员导入的功能，可以通过导入excel对应文件批量导入数据，这些功能vue-element-admin直接提供了，直接引用即可在使用的时候得安装xlsx包npm install xlsx引用import XLSX from 'xlsx'之后就是报错Error: Cannot read properties of undefined (reading 'read') at FileReader.read同时终端也"export 'default' (importe.

2022-04-06 10:44:32 8282 21

原创 this.$parent

在子组件中想要向父组件传值，我们通常使用this.$emit()方法，今天发现this.$parent可以直接调用到父组件的方法和属性，例如// 在子组件中调用父组件的method1方法this.$parent.method1()// 获取父组件属性值this.$parent.prop不过这个方法有个前提条件：父组件在应用子组件的时候，位置不能随意放，例如不能放在element UI组件的插槽里, 通常要放在根元素div里...

2022-04-05 22:16:43 5782

原创插槽的两种使用

我们在封装vue组件的使用经常会用到插槽，插槽的使用可以提高组件的复用率，我们在使用具有插槽的组件的时候，要对插槽进行使用，今天发现另外一种使用插槽的方式定义插槽<slot name="abc" />使用插槽// 1.第一种<button slot="abc">按钮</button>// 2.第二种需要使用template模板<template v-slot:abc> <button>按钮<button>.

2022-04-04 21:57:11 936

原创 sync修饰符

常规情况下，我们进行子向父更新值得时候都需要这样做// 子组件this.$emit('changed', value)// 父组件<child @changed="method" :showlog="showlog" />method(value) { this.showlog = value}但是, vuejs为我们提供了sync修饰符，提供了一种简写得模式// 子组件 update: 固定写法this.$emit('update:showlog', value).

2022-04-03 18:53:47 168

原创上手vuex

1.vuex是什么？Vuex是一个为Vue.js开发的状态管理模式, 在我们之前学习Vue.js的时候，组件之间共享数据分为父传子(props)，子传父($emit)，兄弟组件(EventBus),但是关系复杂组件之间数据共享数据依旧很麻烦。有了vuex我们可以解决不同组件数据共享的很多复杂问题1. state：共享数据状态，共享数据可以在组件中使用，要修改state状态必须通过mutations2.mutations：执行同步操作，修改 state状态3.action: 执行异步操作，异步执行后

2022-03-29 15:29:33 876

原创 mock数据校验请求参数

在前后端分离开发的背景之下, 当后端接口没有完成之前, 前端开发人员所需要的后端数据怎么展现呢? 这里可以利用 mock.js批量生成随机数据, 前端开发者快速生成api接口, 供自己同步后续开发mock.js要了解怎么生成批量假数据, 首先mock.js是一个很值得了解的生成随机数据的JS库，下面是mock.js的官网, 里面有详细文档, 利用它，你可以生成你想要的大部分类型数据mock.js实例文档fastmock我们可以直接利用mock.js在自己的项目中,创建api接口,但个人觉的利.

2022-03-24 21:56:19 1646

原创 vue项目中设置背景高度问题

Q. [ 在创建vue项目中, 当我们想去设置路由页面背景的时候，即使你给div设置了背景颜色,它背景显示的高度都只是你子元素盒子的高度，设置了 *height: 100%*依旧如此，那这究竟是什么导致的呢？]默认的app.vue文件的html，body, #app 都默认高度为 0，所以在子元素中设置高度并不能百分比高度达到效果。解决方式：我们可以对 html, body ,#app 设置高度html,body,#app { height: 100%; margin: 0; p

2022-03-23 22:02:17 1452

空空如也

空空如也