分类: Vue | 我的学习之路

文章分类
JS 7 Vue 24 Js 1 身份认证 1 git 1 vue 1 报错 4 apidoc 1 MongoDB 1 Echarts 1 微信小程序 2 移动端 1 面试 3 Webpack 1 js 1 面试题 1 CSS 1 Vue 1 Flip 1 Element UI 1 数据库 1 uniapp 2 图片懒加载 1 代码人生 2 css 1 分享 1 bug 1 javascript 1 Docker 1 JS 1 Python 1 h5 1 vue 1 解决bug 1 性能优化 1
                            
                            解决接口的跨域问题
                        
                                前言在我们使用express去写接口的时候，存在一个很严重的问题：不支持跨域请求。目前解决接口跨域问题的方案主要分两种：    1、CORS（主流的解决方案，推荐使用）    2、JSONP（程序员使用漏洞解决，缺陷是只支持 GET 请求）
                            
                                2022-05-02
                            
                                    Vue
                                
                            跨域
                        
                            vue命名驼峰问题
                        
                                项目场景：vue2创建好项目的时候，在给路由组件取名字的时候，ESLint会爆出错误，需要使用驼峰命名

问题描述比如书我们在src下创建一个Home.vue作为我们的一个路由组件
vscode提出报错：
Parsing error: No
                            
                                2022-05-02
                            
                                    Vue
                                
                            bug
                        
                            放大镜效果(vue)
                        
                                使用步骤1.引入相应的包因为使用了less所以这一步不是必须的
npm i less --save
npm i less-loader --save

2.样式代码如下（示例）：
<template>
    <div clas
                            
                                2022-05-02
                            
                                    Vue
                                
                            js
                        
                            vue的swiper使用
                        
                                一、引入包首先需要下载包
npm i swiper@5 --save

二、使用步骤1.引入库在我们的入口文件main.js下引入样式
// 引入swiper的样式
import 'swiper/css/swiper.css'

2.使用在
                            
                                2022-05-02
                            
                                    Vue
                                
                            swiper
                        
                            js
                        
                            mock数据（自己写的数据）
                        
                                前言mock是什么？
Mock简单来理解，就是在测试过程中，对于某些不容易构造或者不容易获取的对象，用一个虚拟的对象来创建以便测试。而这个虚拟的对象就是mock对象。mock对象就是真实对象在调试期间的代替品。

一、准备工作首先需要准备一
                            
                                2022-05-02
                            
                                    Vue
                                
                            mock
                        
                            vuex的集中管理使用
                        
                                一、vuex是什么？Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式 + 库。它采用集中式存储管理应用的所有组件的状态，并以
相应的规则保证状态以一种可预测的方式发生变化。
二、使用步骤1.安装代码如下（示例）：
npm in
                            
                                2022-05-02
                            
                                    Vue
                                
                            Vuex
                        
                            重写VueRouter的push|replace
                        
                                前言在进行编程式路由导航的时候，反复点击控制台就会提示报错，为了深入了解编程式路由跳转，以及
防止控制台的多次报错需要对VueRouter的原型上的push以及replace进行重新编写！

编写找到router/index.js文件，也就
                            
                                2022-05-02
                            
                                    Vue
                                
                            Vue
                        
                            nprogress进度条的使用
                        
                                一、安装所需的包在项目文件打开终端
npm i nprogress --save

二、使用步骤1.引入在axios二次封装的文件下导入
代码如下（示例）：
// 导入nprogress
import nprogress from 'npr
                            
                                2022-05-02
                            
                                    Vue
                                
                            nprogress
                        
                            vue里面使用图片的懒加载
                        
                                前言什么是懒加载

通俗地讲就是需要用到图片的时候再去加载懒加载的好处在于减少服务器的压力,在网络比较慢的情况下，可以提前给这张图片添加一个占位图片，提高用户的体验。

一、安装相关的包安装懒加载所需的包
npm install vue-
                            
                                2022-05-02
                            
                                    Vue
                                
                            图片
                        
                            路由跳转传参
                        
                                一、路由跳转的几种方式
第一种：声明式导航

router-link（必须要有to属性），可以实现路由的跳转2. 第二种：编程式导航

利用的是组件实例的$router.push|replace方法，可以实现路由的跳转

编程式导航优于
                            
                                2022-05-02
                            
                                    Vue
                                
                            router
                        
                            axios的二次封装（简洁）
                        
                                前言为什么需要二次封装
api 统一管理,不管接口有多少,所有的接口都可以非常清晰,容易维护.

一、基本页面的创建首先需要准备一个vue的项目

先打开需要创建项目的文件夹下方输入cmd打开窗口
在窗口输入vue create 项目的名称
                            
                                2022-05-02
                            
                                    Vue
                                
                            axios
                        
                            mock数据
                        
                                前言mock是什么？
Mock简单来理解，就是在测试过程中，对于某些不容易构造或者不容易获取的对象，用一个虚拟的对象来创建以便测试。而这个虚拟的对象就是mock对象。mock对象就是真实对象在调试期间的代替品。

一、准备工作首先需要准备一
                            
                                2022-05-02
                            
                                    Vue
                                
                            mock