大黑熊dd-CSDN博客

原创 axios的封装

axios封装，使用拦截器统一处理接口在vue-cli项目的src路径下新建一个axios文件夹，在axios文件夹里新建aps.js和request.js，api.js用于写接口，对axios的封装写在request.js里.：1. axios统一封装然后开始统一封装axios，首先引入axios、qs依赖，引入main.js主要是用于后面对接口进行统一处理，比如调接口的时候，显示loading等。这个main.js根据你个人情况，可加可不加。//request.jsimport axios

2021-05-04 21:49:34 232

原创 vuex的核心概念和运行机制

vuex的五大核心特性1.state 存储vuex所有的数据，类似于vue中data数据//1. state 存储vuex所有的数据，类似于vue中data数据state:{ num:1, list: [],}2.mutations 方法对象，同步修改state中的数据类似于Vue中methodsmutations:{ changeNum(state,payload){ state.num = payload;//修改state中的数据 }

2021-05-04 21:35:09 112

原创 vue-router钩子函数和执行顺序

vue路由钩子大致可以分为三类:1.全局钩子主要包括beforeEach和afterEachbeforeEach钩子函数有三个参数：to 即将进入的路由对象 from即将进入的路由对象 next 是否继续进入进入路由 next(false)阻止进入 next()继续进入路由地址afterEach有两个参数 to from 没有next()函数这类钩子主要用于全局，一般用来判断权限，以及页面丢失时候需要执行的操作const router = new VueRouter({ ... })

2021-05-04 21:25:02 1518

原创 Vue中的$nextTick()

一、NextTick是什么官方给出的定义是：在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOM原理是什么？this.$nextTick()将回调延迟到下次 DOM 更新循环之后执行。在修改数据之后立即使用它，然后等待 DOM 更新。它跟全局方法 Vue.nextTick 一样，不同的是回调的 this 自动绑定到调用它的实例上。假设我们更改了某个dom元素内部的文本，而这时候我们想直接打印出这个被改变后的文本是需要dom更新之后才会实现的，也就好比我

2021-05-04 16:53:47 161

原创 Vue修改数据页面不更新的原因和解决方案

vue2是通过Object.defineProperty来实现数据响应式，因此在vue中写在data中的属性是可以转换成getter和setter，换句话说就是响应式的，其他定义在data之外的数据，是无法响应的渲染，意思就是改变数据页面也不会刷新，所以一切要渲染到页面上的数据，必须写在data中.列举几个不刷新的实例：修改对象的某一属性vue只会将已经在data中声明的属性变为响应，没有声明的是不响应的<template> <div> <div v

2021-05-04 16:41:03 2008 1

原创 v-if和v-for的优先级

v-if和v-for的优先级1.v-for的优先级高于v-if原因：v-for比v-if优先级高，所以使用的话，每次v-for都会执行v-if，造成不必要的计算，影响性能，尤其是当前需要渲染很小一部分的时候。<ul> <li v-for="user in users" v-if="user.isActive" :key="user.id"> {{ user.name }} </li> </ul>如上情况，即使有很多us

2021-05-03 23:49:16 8011 1

原创 Vue组件通信的六种方式

前言组件是 vue.js 最强大的功能之一，而组件实例的作用域是相互独立的，这就意味着不同组件之间的数据无法相互引用。方法一 props/$emit1. 父组件向子组件传值//App.vue父组件<template> <div id="app"> <users v-bind:users="users"></users>//前者自定义名称便于子组件调用，后者要传递数据名 </div></template>&l

2021-04-25 08:53:39 72

原创 js的数据类型和判断

js的数据类型js数据类型有哪些基本数据类型： Number String Boolean Undefined Null Symbol(es6中独一无二的值) BigInt(es10新增)引用数据类型： Object 包括Object Array Function Date RegExp(基本数据类型也称值类型)数据类型判断四种判断方式**typeof、instanceof、constructor、Object.prototype.toString.call()、**jquery.type()

2021-03-31 21:25:50 57

weixin_55716862的博客