- 博客(46)
- 收藏
- 关注
RSS订阅原创 Vuex（vue2中的状态机）
辅助函数 mapState('login',['token','msg']);A组件中分发工作（发起异步请求)--->获取数据--->提交突变(将数据提交给突变 )辅助函数 mapMutations('login',['SET_TOKEN'])辅助函数 mapGetters('login',['Upper'])异步动作 $store.dispatch('login/login')辅助函数 mapActions('login',['login'])状态管理模式 维护公共状态 公共数据。
2024-01-02 16:33:10
685
原创 vue中的路由
2.beforeRouteUpdate 使用组件内的导航守卫beforeRouteUpdate监听到路由参数变化，即将进入路由to对象中params属性中可以获取到最新的参数。beforeRouteEnter（）路由改变进入组件的时候触发---进入该路由对应的组件。beforeRouteUpdate（）该组件被复用时候触发---更新该路由对应的组件。beforeRouteLeave（）离开路由对应组件时候触发--离开该路由对应的组件。通过路由加载组件的方式，主要处理单页面应用程序。
2023-12-27 21:52:04
714
原创 vue中的动态组件和混入
3.值为对象选项（methods,computed,watch,directive）也会合并到一个对象中，如果对象键冲突保留组件内的键值对。使用component切换组件，组件会不停的创建和销毁，如果想在第一次创建时候缓存组件，可以使用keep-alive包裹。errorCaptured 捕获后代组件错误 error(错误对象),vm(发生错误的组件),info(错误提示字符串)1.data选项会进行合并，如果data数据发生冲突，会保留组件内的数据。全局混入对象会影响到每一个组件，谨慎使用。
2023-12-26 21:12:24
774
原创 vue中的render函数和过滤器
需要js完全编程能力，比模板更接近编译器，编译模板，使用render函数我们可以用js语言来构建DOM，因为vue是虚拟DOM，所以在拿到template模板时也要转译成VNode的函数，而用render函数构建DOM，vue就免去了转译的过程。为Vue添加全局功能(指令、过滤器、全局方法、实例方法、第三方库)return createElement(标签名称,{},子节点数组)格式化文本，时间都可以使用过滤器，使用在双花括号内部，使用在v-bind表达式。
2023-12-25 21:27:19
681
原创 Vue中的插槽和自定义指令
v-xxxVue.directive('指令名称',{当被绑定元素插入到父节点调用el---->绑定指令dom元素binding---->元素数据 valuevnode 虚拟节点 dom对象内存中数据表示},// 注册自定义指令// 指令绑定dom元素执行钩子函数 调用一次},// 当被绑定元素插入到父节点中el.focus();})// 局部注册自定义指令myshow:{},},// 指令所在组件更新vnode调用},
2023-12-22 17:43:19
1055
原创 在vue中使用axios发送请求
axios是基于promise的http库，可以运行在浏览器和nodejs。特性：1.运行在浏览器和nodejs2.基于promise，可以使用promise实例方法3.可以对请求和响应拦截处理4.运行在浏览器创建XMLHttpRequests5.运行在nodejs创建http请求。
2023-12-21 13:18:04
2045
原创 vue中的侦听器和组件之间的通信
2.在子组件内声明props选项接收父组件传递的数据 props:['','','']关于vuex后续文章会详细说明，父子组件、兄弟组件、无关系组件任意组件之间的传值。使用Bus.$on('emit发射自定义事件名称',(a,b)=>{使用Bus.$emit('自定义事件名称',传递的数据)2.在父组件中使用$emit发射自定义事件同时传递参数。Bus.$on('自定义事件名称',(a,b)=>{2.在父组件模板中(在子组件标签上)声明自定义事件。Bus.$emit('自定义事件名称',传递数据)
2023-12-20 22:59:01
2468
1
原创 vue中的事件修饰符、表单双向数据绑定和计算属性
对data中数据进行逻辑处理返回一个响应式数据,基于响应式依赖(data),只要响应式依赖不发生改变，计算属性就不会重新计算，多次调用计算属性会返回之前计算得结果。有缓存性，计算属性默认只提供getter，只允许读取，不允许修改，想要修改计算属性，需要提供setter函数。1.计算属性具有缓存性，响应式依赖不发生改变计算属性不会重新计算，会返回之前得计算结果。1.计算属性有缓存性，响应式依赖不发生改变，多次调用计算属性会返回之前得计算结果。3.计算属性一般不用于异步操作，methods可以处理异步操作。
2023-12-19 21:58:02
700
原创 vue中的模板语法、条件渲染（v-if）、列表渲染（v-for）
因为组件是可复用得实例，如果组件data是一个对象，会暴露在全局，数据全局可见，任意一个组件修改该组件数据，其他使用到该组件得组件数据也会被修改，所以data是一个函数不是一个对象，数据仅组件内可见。
2023-12-18 18:48:06
2140
原创 ES6小结
2.模块化 es6模块化 commonjs模块化。3.babel转码工具 将高版本转为低版本代码。1.变量声明方式 let const。10.对象简写 方法简写 属性简写。16.generator生成器。12.Symbol基本数据类型。15.String方法拓展。具体内容可以看我之前的博客内容。7.对象静态API拓展。2015年以后新增特性。
2023-12-14 19:47:00
168
原创 ES6中的promise对象及其应用
得到一个promise实例对象 所有实例请求成功或者所有实例都为fullfilled 实例才是fullfilled。resolve---promise实例状态为fullfilled执行回调函数--------请求成功执行回调函数。reject ---promise实例状态为rejected执行回调函数 ---------请求失败执行回调函数。2.fullfilled 已成功-------resolve。3.rejected 已失败---------reject。
2023-12-13 14:33:20
947
原创 ES6中的数值拓展、async函数和迭代器
异步编程解决方法 内部封装了generator函数 异步编程同步解决 简化promise api链式调用。Number.isFinite 只针对有效数值返回true 对于非有效数值返回false 不做隐式转换。3.for of 只能遍历实现了迭代器接口对象 对象不可以直接使用for...of遍历。Number.isNaN 只对于NaN返回true 对于非NaN返回false。Number.parseInt 将其他数据类型转为number类型 取整。2.for in 循环遍历数组、对象、字符串、类数组对象。
2023-12-12 15:24:22
286
原创 ES6中的迭代器和set、map集合
一种机制，也是一种接口，为数据结构提供统一访问接口，依次处理数据据结构成员只要实现了迭代器接口，就可以使用for...of循环遍历。/*** 迭代器是一种机制 是一种接口 只要数据解构实现了接口 就可以使用for ...of遍历*/// 遍历字符串 str = 'hello'/*** 1.for 循环* 2.for in循环* 7.for of循环遍历字符串*/i++){迭代器本质就是迭代器对象调用next方法，迭代对象理解为指针对象，指针指向数据结构成员。
2023-12-11 14:09:34
738
原创 ES6中新增的基本数据类型----symbol
Symbol 基本数据类型 独一无二得值 Symbol函数创建 接收字符串 对symbol值得描述let s1 = Symbol('描述')/*** symbol 基本数据类型 表示独一无二的值 Symbol函数创建独一无二得值 参数可以是唯一值得描述*///创建好一个独一无二得值let sy1 = Symbol('symbol数据类型');//对独一无二值得描述。
2023-12-08 20:55:39
409
原创 ES6中的继承，String类型方法的拓展
在ES5中所了解的String类型方法有charAt、charCodeAt、slice、upperCase、lowerCase、replace、split、indexOf、lastIndexOf····从头部添加字符串 填充字符串长度 填充字符(默认空格)从尾部添加字符串 填充字符串长度 填充字符(默认空格)当成函数调用时，代表父类的构造函数，且返回的是子类的实例，也就是此时。将字符串中的某个元素全部替换为另一个。单独去除字符串前后空格。，因为没有的话会默认产生并调用它们。在实现继承时，如果子类中有。
2023-12-07 14:37:01
358
原创 ES6拓展API
findIndex 查找数组元素 参数:回调函数(item,index,arr) 返回值：返回符合条件得第一个数组元素索引或者-1。find 查找数组元素 参数:回调函数(item,index,arr) 返回值：返回符合条件得第一个数组元素或者undefined。静态属性 只能由类本身去调用属性 Person.xxx = '' Person.method = function(){}
2023-12-06 19:41:55
479
原创 ES6基础语法
3.普通函数使用arguments保存实际参数，箭头函数使用rest参数保存实际参数。内部没有this属性 不再使用arguments保存实际参数 用rest参数。2.箭头函数没有this，this访问声明箭头函数外部作用域中的this。1.普通函数内部this指向全局对象，方法指向调用者。给右侧值匹配对应的变量 等号两侧模式一定要匹配。4.普通函数有原型对象，箭头函数没有原型对象。5.外观上 ()=>{}
2023-12-05 20:12:55
849
原创 ES6与ES5的区别？
3.导出单个属性 export let a =1;import person from 'xxx.js' person ---->默认导出内容。2.重命名导出 export {first as fi,last as la}1.列表导入 import {first,last} from 'xx.js'2.重命名导入 import {first as f,last as l};3.单个属性导入 import {a,get} from 'xxx.js'1.列表导出 export {first,last}
2023-12-04 15:19:46
567
原创 jQuery的使用
事件类型：click() blur() focus() mouseenter() mousedown()toggleClass() 切换类名 有类名则是移除 没有则是添加。绑定事件：on(function(event){}) bind() one()一次性事件绑定。clone() 深克隆和浅克隆 克隆事件和内容。解绑事件：off() unbind()html() 元素的内容 包括文本和标签。removeClass() 移除类名。text() 只获取元素的文本内容。addClass() 添加类名。
2023-12-01 14:23:00
298
原创 jQuery和JavaScript的区别
jquery入口函数可以有多个会依次执行 $(function(){})js入口函数只有一个 后面的会覆盖前面的。
2023-11-30 15:43:00
274
原创 事件机制？
元素.addEventListener('事件类型',事件处理程序,true/false)，true 表示事件在捕获阶段执行，false表示事件在冒泡阶段执行，默认为false。那么如果我们不想让事件进行冒泡，也就是说当我们点击最里面的小方块时，只弹框inner，那么就可以调用event.stopPropagation();正常情况下，当我们点击a标签或者提交按钮时会进行页面跳转，但是如果我们给a标签绑定单击事件，并阻止它的默认行为，那它就无法跳转。绑定事件------不可以追加同一类型事件。
2023-11-27 14:35:28
317
原创 获取DOM元素和类型判断
setAttribute('属性名','属性值');通过name属性获取元素。1.querySelector('选择器');//获取一个类数组对象。1.textContent 只能获取元素或者后代元素的文本 保留代码格式。getAttribute('属性名') 获取元素属性。classList 获取元素类列表 class ='one two'3.innerText 获取元素以及后代元素文本内容 去除前后空格。replaceData() 替换文本内容。
2023-11-24 20:37:14
597
原创 DOM文档对象模型
DOM(Document Object Model) 文档对象模型，是W3C制定的标准接口规范，是一种处理HTML和XML文件的标准API。简单来说DOM就是操作网页的api和接口。
2023-11-23 20:07:41
400
原创 JavaScript中的random小案例
Math对象是JavaScript的内置对象，而random是Math对象属性Math.random（）函数返回一个浮点数，伪随机数在范围从0 到小于1，也就是说，从 0（包括 0）往上，但是不包括 1（排除 1），然后你可以缩放到所需的范围。实现将初始种子选择到随机数生成算法;它不能被用户选择或重置。一、每次打印都输出一个随机数// 求随机数//0-1之间小数var arr = ['上官婉儿','萌芽','甄姬','虞姬','典韦'];代码运行结果如下：二、生成随机圆
2023-11-20 16:15:46
451
1
原创 JavaScript中函数内部属性
callee 属性是arguments内部成员（arguments属性的内部属性）仅当当前函数正在执行时候才可用，callee 属性指向当前执行函数。bind(执行环境对象,实际参数列表)(实际参数列表)此时this指向本来应该是obj，但是由于我们修改了this指向，所以此时this就指向了obj1。2.apply(执行环境对象,实际参数数组列表---->[实际参数])若代码可以循环遍历出1，2，3，4和他们的下标，便可知arguments是一种类数组对象。此时的this指向的就是{}
2023-11-17 15:10:38
200
原创 实现数组去重和数组扁平化的多种方法
思路：创建一个新的数组 判断重复数组元素是否存在新数组中 不存在直接添加到新数组。思路：检测数组元素是否存在数组中 存在返回true 不存在返回false。思路：对比前一项和后一项是否相等 相等删除后一项，修正下标。思路：展开数组 n Infinity。思路：set成员是唯一的。
2023-11-16 16:11:14
585
2
原创 JavaScript中的迭代方法和这些方法的重构
参数：function(item,index,arr){} 返回值：true或者false 不修改原数组。参数：function(item,index,arr){} 返回值：返回操作后的新数组 不修改原数组。参数：function(item,index,arr){} 返回值：返回符合条件新数组 不修改原数组。参数：function(item,index,arr){} 返回值：无 不修改原数组。
2023-11-15 15:13:27
276
1
原创 JavaScript中数组栈和队列方法和这些方法的重构
参数：添加的数组元素 返回值：新数组长度 修改原数组。参数：无 返回值：被删除最后一个数组元素 修改原数组。参数：无 返回值：被删除的第一个数组元素 修改原数组。重写myUnshift实现与unshift一样的功能。参数：添加的数组元素 返回值：新数组长度 修改原数组。重写myShift实现与shift一样的功能。作用：从末尾删除数组元素。作用：从头开始删除数组元素。作用：从头开始添加数组元素。作用：从末尾添加数组元素。
2023-11-14 17:00:32
961
1
原创 JavaScript中的数组和两个简单案例
/number类型整数 数组长度为number。var arr = new Array(其他数据类型);1.数组元素可以是任意数据类型。使用for in 循环。2.大小可以动态调整。是一个有序列表集合。
2023-11-13 17:21:00
261
原创 JavaScript简单小案例（求最长单词长度、水仙花数、返回和为目标值的数组下标、封装阶乘输出表达式）
使用for循环循环遍历从n到2的每一个数，然后让循环遍历的每个数后边拼接字符'*',声明一个空字符串，再将他们进行相加（字符串拼接）操作，再将这个数后面拼接一个字符‘1‘（因为1后面没有*字符），再声明一个初始值为1的变量，做相乘操作，和就为阶乘结果，最后将结果进行字符串拼接。用两层for循环遍历数组元素，第二层循环遍历的数组元素为第一层循环遍历的数组元素的后一个，这样就可以保证两个数组元素不是同一个，声明一个变量为两个数组元素之和，然后判断与目标值是否相等，相等时，返回数组的下标。
2023-11-10 17:24:01
390
2
原创 JavaScript实现冒泡排序和递归函数
简单来说，递归就是创建一个调用自身的函数，直到程序满足了我们想要达到的效果。通常我们会用递归来进行深拷贝、斐波那契数列、阶乘···要注意的是，我们在使用递归函数时必须要设置一个跳出条件，否则函数就会不停的调用自己。接下来我会写一个用递归函数实现阶乘的例子，让我们熟悉递归函数的使用。
2023-11-09 17:05:54
708
1
原创 JavaScript中的流程控制语句
意思是先计算表达式的值，再逐个和case 后的常量表达式比较，若不等则继续往下比较，若一直不等，则执行default后的语句；else if：如果if的判断没有通过，则进行下面的else if，如果当前的else if判断通过，则执行当前else if的语句。while循环执行循环体前都会先判断下（执行循环控制表达式），而do-while循环会在执行循环控制表达式前先执行一遍循环体（这第一遍循环体是不进行判断的，直接执行）if：判断表达式内容，如果为true(真)，就执行语句。
2023-11-08 16:55:40
379
1
原创 JavaScript中的运算符与类型转换
2.调用toString()方法 注意:null和undefined不能调用toString,没有实现包装器函数。如果是number和布尔值相等比较 把布尔值转为number。2.===首先会比较数据类型，数据类型不一致，直接返回false。== 和 ===在对引用数据类型比较得时候比较得是引用地址。如果是字符串和数字相等比较，把字符串转为number。1.==会进行隐式转换，将其他数据类型转为同一类型在进行比较。2.如果重写了valueOf,调用valueOf。3.如果都进行重写,调用valueOf。
2023-11-07 17:29:28
377
1
原创 JavaScript的基本概念和简单案例
JavaScript是一门函数优先、需要解析器解析执行具有原型编程的一门动态编程语言，需要在浏览器或者node.js的运行环境下解析执行特点：1.需要解析器解析执行2.弱类型语言 (可以重复声明)3.从上到下按照代码解析顺序执行4.大小写敏感 区别于HTML和css：大小写不敏感数据类型分为：1.基本数据类型(简单数据类型)2.引用数据类型(复杂数据类型)Object数组 函数两种数据类型有何区别？1.基本数据类型的变量和值都是存在栈区的，互不影响的。
2023-11-06 15:32:19
143
原创 HTML中的自适应布局
自适应布局的特点是分别为不同的屏幕分辨率定义布局，即创建多个静态布局，每个静态布局对应一个屏幕分辨率范围。改变屏幕分辨率可以切换不同的静态局部（页面元素位置发生改变），但在每个静态布局中，页面元素不随窗口大小的调整发生变化。可以把自适应布局看作是静态布局的一个系列。
2023-11-03 20:20:04
4375
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人