- 博客(19)
- 收藏
- 关注
RSS订阅原创 react 中 redux的简单使用
npx create-react-app counter --template redux 一、安装reduxnpm install redux --save# 或yarn add redux二、redux文件目录的构建（src目录下创建store文件夹）1、创建store/index.js 文件store就是整个项目保存数据的地方，并且只能有一个。创建store就是把所有的reducer给他import { createStore } from 'redux'impo
2021-03-19 15:37:32
164
原创 React生命周期详解
生命周期初始化initialization阶段class Test extends Component { constructor(props) { super(props); }}也就是以下代码中类的构造方法( constructor() ),Test类继承了react Component这个基类，也就继承这个react的基类，才能有render(),生命周期等方法可以使用，这也说明为什么函数组件不能使用这些方法的原因。super(props)用来调用基类的构造方法( con
2021-03-15 17:37:21
274
2
原创 vue生命周期详解
Vue生命周期生命周期：从Vue实例创建、运行、到销毁期间，总是伴随着各种各样的事件，这些事件，统称为生命周期创建期间的生命周期函数：beforeCreate：实例刚在内存中被创建出来，此时，还没有初始化好 data 和 methods 属性created：实例已经在内存中创建OK，此时 data 和 methods 已经创建OK，此时还没有开始 编译模板beforeMount：此时已经完成了模板的编译，但是还没有挂载到页面中mounted：此时，已经将编译好的模板，挂载到了页面指定的容器中显示
2021-03-11 11:01:25
138
原创 forEach map 和for的区别
forEach map 和forforEach 和for的区别1.在固定长度或者长度不需要计算的时候for循环效率高于foreach，在不确定长度或者计算长度有损性能的时候用foreach比较方便2.foreach适用于只是进行集合或数组遍历，for在较复杂的循环中效率更高。3.如果对集合中的值进行修改，就要用for循环了。其实foreach的内部原理其实也是Iterator,但它不能像Iterator一样可以人为的控制，而且也不能调用iterator.remove()；更不能使用下标来访问每个元素
2021-03-10 18:03:49
720
原创 ES6解构的运用 数组 /对象
解构赋值是对赋值运算符的扩展。他是一种针对数组或者对象进行模式匹配，然后对其中的变量进行赋值。在代码书写上简洁且易读，语义更加清晰明了；也方便了复杂对象中数据字段获取。Array数组模型的解构基本解构（完全解构）：let [a,b,c] = [1,2,3]console.log(a,b,c) //1,2,3可嵌套var [a,[b,c]] = [1,[2,3]]console.log(a,b,c) //1,2,3可忽略var [a,,c] = [1,3]]console.
2021-03-10 16:13:05
80
原创 ES6箭头函数
箭头函数箭头函数表达式的语法比函数表达式更简洁，并且没有自己的this，arguments，super或new.target。箭头函数表达式更适用于那些本来需要匿名函数的地方，并且它不能用作构造函数。var test=[1,2,3,4,5]test.map((item)=>{ console.log(item)})基本语法：（a,b,c）=>{ }如果只有一个参数的话括号可以省略引入箭头函数有两个方面的作用：更简短的函数并且不绑定this。1.更简短的函数：普通函数
2021-03-10 15:04:33
56
原创 JavaScript数据类型
JavaScript数据类型js一共有六种数据类型：五种简单数据类型和一种复杂数据类型：五种简单数据类型包括：String、Number、Boolean、undefined、Null一种复杂数据类型：obeject检测数据类型1.typeoftypeof 是一个操作符，其右侧跟一个一元表达式，并返回这个表达式的数据类型。返回的结果用该类型的字符串(全小写字母)形式表示，包括以下 7 种：number、boolean、symbol、string、object、undefined、function
2021-03-10 11:51:16
54
原创 CSS3中伸缩盒布局 display:flex
采用Flex布局的元素，称为Flex容器（flex container），简称"容器"。它的所有子元素自动成为容器成员，称为Flex项目（flex item），简称"项目"。容器默认存在两根轴：水平的主轴（main axis）和垂直的交叉轴（cross axis）。主轴的开始位置（与边框的交叉点）叫做main start，结束位置叫做main end；交叉轴的开始位置叫做cross start，结束位置叫做cross end。项目默认沿主轴排列。单个项目占据的主轴空间叫做main size，占据的交叉轴空间
2021-03-09 18:38:21
133
原创 ECMAscript 6 中 Promise的原理以及使用
promiseECMAscript 6 原生提供了 Promise 对象。promise 对象用于表示一个异步操作的最终完成 (或失败)及其结果值。promsie必然处于以下几种状态之一：待定（pending）: 初始状态，既没有被兑现，也没有被拒绝。已兑现（fulfilled）: 意味着操作成功完成。已拒绝（rejected）: 意味着操作失败。待定状态的 Promise 对象要么会通过一个值被兑现（fulfilled），要么会通过一个原因（错误）被拒绝（rejected）。当这
2021-03-09 16:33:46
197
原创 总结ES5,ES6中最容易理解的数组去重的方法
方法一：使用indexOf（）但是IE8以下不支持/** 新建一新数组，遍历传入数组，值不在新数组就push进该新数组中* IE8以下不支持数组的indexOf方法* */var arr=[2,4,2,4,5,6,7,8,4,45,6,2,25,6]var arr1=[]for(var i=0;i<arr.length;i++){ if(arr1.indexOf(arr[i])==-1){ arr1.push(arr[i]) }}c
2020-12-03 20:19:31
250
原创 JS原型，原型链的理解
Javascript语言的继承机制一直很难被人理解。它没有"子类"和"父类"的概念，也没有"类"（class）和"实例"（instance）的区分，全靠一种很奇特的"原型链"（prototype chain）模式，来实现继承。原型每个函数都有prototype(原型)属性，这个属性是一个指针，指向一个对象，这个对象的用途是包含特定类型的所有实例共享的属性和方法，即这个原型对象是用来给实例共享属性和方法的。而每个实例内部都有一个指向原型对象的指针。任何对象都有一个原型对象，这个原型对象由对象的内置属性
2020-12-03 19:14:39
76
原创 跨域问题解决
跨域，指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对javascript施加的安全限制。同源策略什么是同源策略，其作用是什么？同源策略指的是：协议+域名+端口三者皆相同，可以视为在同一个域，否则为不同域。同源策略限制了从同一个源加载的文档或脚本如何与来自另一个源的资源进行交互。作用是一个用于隔离潜在恶意文件的重要安全机制。前端解决跨域问题jsonp：只支持 GET，不支持 POST 请求，不安全 XSSJSONP 请求本质上是利用了 “Ajax 请求会受到同源.
2020-12-02 23:59:24
86
原创 vue项目打包时npm run build报错
我们本地使用vue项目使用npm run dev即可，但是如过要上传到阿帕奇上就必须将其项目打包 使用npm run build即可使用npm run build 会报错：npm ERR! missing script: buildnpm ERR! A complete log of this run can be found in:npm ERR! C:\Users\AnD\AppData\Roaming\npm-cache_logs\2020-11-28T12_09_15_012Z-d
2020-11-28 20:14:46
1715
原创 Vue中插槽的使用
Vue中插槽的使用什么是插槽？插槽就是子组件中的提供给父组件使用的一个占位符，用 表示，父组件可以在这个占位符中填充任何模板代码，如 HTML、组件等，填充的内容会替换子组件的标签。插槽的三种使用方法1.普通插槽插槽允许我们在调用子组件的时候为子组件传递模板。 <div id='app'> <test> <template >{{msg}}</template> </test>
2020-11-25 18:52:13
154
原创 运行用VUE中的组件通信，实现简单购物车加购，求其总数
运行用VUE中的组件通信，实现简单购物车加购，求其总数组件是vue.js最强大的功能之一，而组件实例的作用域是相互独立的，这就意味这不同组件之间的数据无法直接相互引用。我们可以使用组件之间的通信来实现其功能首先先从cdn中引入我们所需要的依赖 <script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.9/vue.min.js"></script>这里附上HTML代码 test子组件必须要在根组件之内，我们复
2020-11-25 16:24:39
318
原创 DOM阶段中的事件机制
DOM阶段中的事件机制事件三要素：1:事件源：事件被触发的对象2.事件类型：如何触发？触发什么事件？3.事件处理程序：通过函数赋值的方式执行事件的步骤1.获取事件源2.注册事件（绑定事件）3.采用函数赋值形式添加事件处理程序在JavaScript中，有三种常用的绑定事件的方法：在DOM元素中直接绑定；<button onclick="alert('hello')">点击</button>在JavaScript代码中绑定； eye.onclick
2020-11-17 19:06:58
67
原创 VUE 入门 表单的输入绑定
VUE 入门 表单的输入绑定概述用v-model指令在表单、 及 元素上创建双向数据绑定。它会根据控件类型自动选取正确的方法来更新元素。v-model 会忽略所有表单元素的 value、checked、selected attribute 的初始值而总是将 Vue 实例的数据作为数据来源。应该通过 JavaScript 在组件的 data 选项中声明初始值。首先安装依赖，这里直接从cdn导入<script src="https://cdn.bootcdn.net/ajax/libs/vue
2020-11-17 17:06:32
85
原创 Javascript中类的创建与继承（ES5,ES6）
一、ES5中，a. 类的创建new一个function类,在function中的prototype里面添加属性和方法，例如先创建一个Animal类，并且添加一个原型方法eat//定义一个动物类function Animal(name){ this.name=name //属性 this.text=function(){ //实例方法 console.log('text') }}Animal.prototype.eat=function(){
2020-11-17 15:07:38
430
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人