- 博客(27)
- 收藏
- 关注
RSS订阅原创 总结(面试题)
查找数组重复项var find = function(arr=[]){ var result = [] // 遍历数组 arr.forEach(item=>{ // 如果item首次出现的位置和最后出现的位置的下标不同,则说明该item至少重复出现1次 if(arr.indexOf(item)!==arr.lastIndexOf(item)&&!result.includes(item))
2021-05-21 01:48:45
135
原创 vue源码(一)
Dep它的实例是什么时候创建的?初始化的时候为data中的所有属性进行数据劫持(添加get和set)是创建的个数?与data中的属性一一对应Dep的结构?id: 每一个dep的独立标识subs: [] n个相关的watcher的容器Watcher它的实例是什么时候创建的? {{a}} v-text=“a”初始化的解析(一般指令/大括号表达式)时候创建个数?与模版中表达式(不包含事件指令)一一对应watcher的结构?this.cb = cb; //用于更新界面的
2021-05-07 00:44:59
131
原创 微信小程序
微信小程序,小程序的一种,是一种不需要下载安装即可使用的应用小程序与普通网页开发的区别小程序的主要开发语言是JavaScript,小程序的开发同普通的网页开发相比有很大的相似性.对于前端开发者而言,从网页开发迁移到小程序的开发成本并不高,但是二者还是有些许区别的网页开发渲染线程和脚本线程是互斥的,这也是为什么长时间的脚本运行可能会导致页面失去响应,而在小程序中,二者是分开的,分别运行在不同的线程中网页开发者可以使用到各种浏览器暴露出来的DOM API,进行DOM选中和操作而如上述所说,小
2021-05-07 00:44:38
145
原创 梦学谷会员管理系统(二)
各模块技术点+难点用mock.js来模拟假数据他可以为我们提供模拟的数据,让我们在开发中便于测试,当后端接口设计好后,只需要将对应的接口请求函数的路径换掉,其他的地方不变,这样就大大提高了我们的开发效率1.首先,我们需要安装相应的依赖npm i mockjs --save2.然后在项目对应的src下创建一个文该件夹mockjs，在这个文件夹内部创建一个mock.js的文件，在该文件内部，模拟mock产生的模拟数据格式。引入mock.js获取mock.Random对象模拟数据：先创建一个生成
2021-05-06 01:06:31
258
原创 梦学谷会员管理系统(一)
项目架构项目技术栈vue-router和路由拦截element-ui封装api面包屑导航侧边栏mock.js项目所有模块登录模块首页模块会员管理供应商商品员工
2021-05-06 00:58:54
381
1
原创 小米商城项目总结(一)
项目架构项目技术栈vue路由vue-routerelement-uivuex全局组件路由拦截axiosapi封装项目所有模块登录模块注册模块首页模块全部商品我的订单收藏购物车
2021-05-06 00:44:33
1261
原创 电商后台管理系统(二)
各模块技术点权限管理1.修改用户信息根据id查询需要修改的用户数据//展示编辑用户的对话框async showEditDialog(id) { //发送请求根据id获取用户信息 const { data: res } = await this.$http.get('users/' + id) //判断如果添加失败，就做提示 if (res.meta.status !== 200) return this.$message.error('获取用户信息失败')
2021-05-06 00:33:22
210
原创 电商后台管理系统(一)
项目架构项目技术栈axios和路由拦截侧边栏和面包屑页面布局和可复用组件element-ui封装api项目所有模块登录A. 登录状态保持如果服务器和客户端同源，建议可以使用cookie或者session来保持登录状态如果客户端和服务器跨域了，建议使用token进行维持登录状态。B. 登录逻辑：在登录页面输入账号和密码进行登录，将数据发送给服务器服务器返回登录的结果，登录成功则返回数据中带有token客户端得到token并进行保存，后续的请求都需要将此token发送给服务
2021-05-06 00:00:45
923
原创 vue双向数据绑定原理
通过v-module来实现，原理就是利用了 Object.defineProperty() 这个方法重新定义了对象获取属性值(get)和设置属性值(set)的操作来实现的vuex是一个专门为vue开发的状态管理模式语法： Object.defineProperty(obj, prop, descriptor) 其中： obj —— 要在其上定义属性的对象 prop —— 要定义或修改的属性的名称。
2021-05-05 20:53:22
82
原创 axios的封装
安装npm install axios; // 安装axios第一步：配置axios首先，创建一个Service.js，这里面存放的时axios的配置以及拦截器等，最后导出一个axios对象import axios from 'axios'import { Message, Loading } from 'element-ui'const ConfigBaseURL = 'https://localhost:3000/' //默认路径，这里也可以使用env来判断环境let loadingIn
2021-05-05 20:49:11
132
原创 vuex的核心概念和运行机制
核心概念:（1）State: 存放基本数据 ----辅助函数mapState: 当一个组件需要获取多个状态时候，将这些状态都声明为计算属性会有些重复和冗余。为了解决这个问题，我们可以使用 mapState 辅助函数帮助我们生成计算属性，让你少按几次键。 （2）getters：专门来计算state中的数据，相当于state中数据的计算属性 —辅助函数mapGetters辅助函数: mapGetters 辅助函数仅仅是将 store 中的 getters 映射到局
2021-05-05 20:31:13
183
原创 vue-router钩子函数和执行顺序
vue-router的导航守卫实际和组件的生命周期都是同一类型的钩子函数，在一个特定时间内会触发。导航守卫有三个类型，分别是全局的钩子（针对整个路由器实例），单个路由对象的钩子和组件内的钩子。const router = new VueRouter({ mode: "history", base: process.env.BASE_URL, routes,});//全局前置守卫router.beforeEach((to, from, next) => {});// 全局解
2021-05-05 20:21:14
577
原创 $nextTick
nextTick原理1、异步说明Vue 实现响应式并不是数据发生变化之后 DOM 立即变化，而是按一定的策略进行 DOM 的更新2、事件循环说明简单来说，Vue 在修改数据后，视图不会立刻更新，而是等同一事件循环中的所有数据变化完成之后，再统一进行视图更新。$nextTick的使用场景场景1在 created 和 mounted 阶段，如果需要操作渲染后的视图，可以使用 nextTick 方法。场景2在希望所有子组件加载完成时进行某些操作时，可以采用应用场景下面了解下nextTick的
2021-05-05 20:12:23
101
原创 修改数据页面不更新的原因和解决方案
第一种:动态给对象新增属性或者删除属性是不会触发视图刷新的,Vue识别不到第二种:通过数组下标修改数组中的元素或者手动修改数组的长度,Vue识别不到:解决方案:1.静默刷新(使用v-if的特性)在修改值之后将元素销毁,然后在修改后的下一次DOM渲染完成时再显示出来,这样就会触发组件重新加载data的数据进行渲染,data中被修改的数据才是最新的2.vue.$set官方对这个API的解释就是使用这个api修改的数据会为其添加响应式getter和setter让其拥有数据响应的特性
2021-05-05 20:03:23
1602
原创 v-for中的key值的作用
我们都知道,vue很大的一个特点就是双向数据绑定,数据一旦改变,那么页面就会渲染新的数据呈现在页面上对于v-for渲染的列表数据来说,数据量可能一般很庞大,而且我们经常还要对这个数据进行一些增删改操作假设我们给列表增加一条数据,整个列表都要重新渲染一遍,那不就很费事吗,而key的出现就是尽可能的回避了这个问题,提高效率,如果我们给列表增加一条数据,页面只渲染了这个数据,那不就很完美了v-for默认使用就地复用策略,列表数据修改的时候,他会根据可以值去判断某个值是否修改,如果修改,则重新渲染这一项,否则
2021-05-05 19:44:24
2659
原创 v-if和v-for的优先级
v-for和v-if不应该一起使用,必要的情况下应该替换成computed属性.原因是:vue处理指令时,v-for比v-if优先级更高一点,如果每一次都需要遍历整个数组,将会影响速度,尤其是当需要渲染很小一部分的时候错误的写法这样的情况,即使100个user中只需要使用一个数据,也会循环遍历整个数组正确的写法...
2021-05-05 19:10:39
226
原创 v-if和v-show的区别
v-ifv-if 控制元素显示或隐藏是把dom元素整个的渲染或者删除，如果删除，也就是页面中不存在这个dom元素，以此达到隐藏的效果；所以v-if在每次切换的时候都会重新创建或者销毁元素，有较高的切换性能消耗；而且v-if是惰性的，如果在初始渲染时条件为假，那就什么也不做，直到条件第一次变为真时，需要渲染时才会开始渲染条件块v-showv-show则是无论你的初始条件是什么，元素都会被渲染，就是dom元素始终是存在的，v-show只是通过控制css中的display属性来控制他的显示或隐藏；它拥
2021-05-05 18:54:51
81
原创 组件中data为什么是一个函数?
组件中的data写成一个函数,数据是以函数返回值形式定义的,这样每复用一次组件,就会返回一份新的data.如果单纯的写成对象形式,就使得所有组件实例共用了一份data,造成了数据污染组件中的data组件是一个具有单独自身功能模块的封装，这个模块有属于自己的HTML模板，也应该有属于自己的数据data，组件也有自己的方法methods注意：组件不能直接访问Vue实例中定义的数据。就算可以访问，若将所有的数据都放在Vue实例中，Vue实例就会变得非常臃肿（数据很多），所以组件应该有自己保存数据的地方因此
2021-05-05 18:45:59
1452
原创 vue面试题总结(一)
为何组件的data必须是一个函数目的是为了防止多个组件实例对象之间共用一个data,产生数据污染采用函数的形式,initData时会将其作为工厂函数都会返回全新data对象组件中的data写成一个函数，数据以函数返回值形式定义，这样每复用一次组件，就会返回一份新的data，类似于给每个组件实例创建一个私有的数据空间，让各个组件实例维护各自的数据。而单纯的写成对象形式，就使得所有组件实例共用了一份data，就会造成一个变了全都会变的结果。vue的常用指令v-model 多用于表单元素实现..
2021-04-28 21:42:27
169
原创 vue组件传值
1.父传子 prop在父组件的子组件标签上绑定一个属性,挂在要传输的变量[在这里插入图片描述](https://img-blog.csdnimg.cn/20210425005221793.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl81NDIyODA0NQ==,size_16,color_FFFFFF,t_70#pic_cen
2021-04-25 00:53:30
117
原创 vue生命周期
Vue实例有一个完整的生命周期，也就是说从开始创建、初始化数据、编译模板、挂在DOM、渲染-更新-渲染、卸载等一系列过程beforeCreate( 创建前 )在实例初始化之后，数据观测和事件配置之前被调用，此时组件的选项对象还未创建，el 和 data 并 未初始化，因此无法访问methods， data， computed等上的方法和数据。created ( 创建后 ）实例已经创建完成之后被调用，在这一步，实例已完成以下配置：数据观测、属性和方法的运算，watch/event事件
2021-04-12 21:38:52
37
原创 JS中常用的事件类型/操作行为
事件事件就是一件事情,或者一个操作行为在JS中任何一个元素天生自带了很多的行为(和我们是否为其绑定方法没有关系)常见的鼠标事件click 鼠标单击事件,当单击鼠标(一般都为左键)或按下回车键时,会触发事件dbclick 鼠标为双击事件,当双击鼠标时,会触发事件mousedown 当任意按下鼠标键时,会触发事件mouseup 当释放鼠标按键时,会触发事件mouseover 当鼠标移动进到当前元素的区域就会触发事件mouseout 当鼠标移出当前元素的区域就会触发事件mousemove
2021-04-11 22:38:17
444
原创 数据类型判断
1.typeoftypeof undefined // 'undefined' typeof '10' // 'string' typeof 10 // 'number' typeof false // 'boolean' typeof Symbol() // 'symbol' typeof Function // ‘function' typeof null // ‘object’ typeof [] // 'object' typeof {} //
2021-04-05 21:38:52
52
原创 字符串的常用方法
indexOf返回指定字符串第一次出现的位置indexOf(substr[,start])返回 substr 在字符串 str 中首次出现的位置,从 start 位置开始查找，如果不存在，则返回 -1。start可以是任意整数，默认值为 0。如果 start < 0 则查找整个字符 串（如同传进了 0）。如果 start >= str.length，则该方法返回 -1，除,非被查找的字符串是一个空字符串，此时返回 str.length.var str = "javascript
2021-04-01 21:47:45
245
原创 js数组方法
join()把数组转换为字符串,然后给他规定一个连接字符,默认是逗号(,)格式: join(" "), 括号里写字符串,要加引号var arr = [1,2,3]console.log(arr.join()) //1,2,3console.log(arr.join("-")) //1-2-3console.log(arr) //[1,2,3] 原数组不变push()和pop()push() 把里面的内容添加到数组末尾,返回修改后的长度 arr.push(" "),括号
2021-03-31 21:25:18
66
原创 闭包
1. 简介闭包就是能够读取其他函数内部变量的函数。只有函数内部的子函数才能读取局部变量，在本质上，闭包是函数内部和函数外部连接起来的桥梁。当函数可以记住并访问所在词法作用域时，就产生了闭包，即使函数是在当前词法作用域之外执行2.定义如果在一个内部函数里，对在外部作用域(但不是全局作用域)的变量进行引用，那么内部函数就被认为是闭包(closure)。3.特点1.可以读取自身函数外部的变量(沿着作用域链寻找)先从自身开始查找，如果自身 没有才会继续往上级查找，自身如果拥有将直接调用
2021-03-30 21:46:12
80
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人