- 博客(19)
- 收藏
- 关注
RSS订阅
原创 vue 组件之间的数据传递方法
几种方式：props emitprovide inject (依赖注入)this.$root this.$parent this.$refs(节点访问)eventbus 事件触发器1、props emit这种传值分为两种方式，父组件→子组件； 子组件→父组件； （????????♂️：和我们两个有关系嗷）????????这种...
2020-04-19 01:02:41
538
原创 初识Vuex 自整理
部分内容摘自Vuex的官方文档????Vuex????什么是Vuex我们的组件与组件之间或者组件与实例之间都是需要一些数据的互相通信的，是可以通过props进行传递，但当组件嵌套的过于深层，或者我们应用的复杂度越来越高的时候，这种传统的数据传递方式就显得有些麻烦，所以我们可以使用Vuex进行数据的互通。????引用官网定义????：Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管...
2020-04-04 20:41:55
228
原创 常见开发问题整理
规定文字显示行数，多余部分用省略号代替设置元素宽度width:200px;overflow: hidden;//超出文本隐藏text-overflow: ellipsis;//超出文本省略号显示display: -webkit-box;//设置为webkit盒模式-webkit-line-clamp: 2;//2行显示-webkit-box-orient: vertical;//从上到下垂直排列不设置宽度，弹性布局。父元素设置：display:flex,子元素：flex：1flex:
2020-09-03 20:55:10
217
原创 项目中遇到的一像素解决方案
一像素边框的解决方案原因：不同的设备，不同的设备像素比（dpr）导致的；通过media来媒体查询React：style-components解决方案可设置颜色、类型、粗细，有默认值，也可通过父组件来传递参数//定义import styled from 'styled-components'const border = StyledComp => { return styled(StyledComp) ` position: relative; border-radi
2020-09-02 21:06:14
259
原创 面试整理
说说你都知道哪些排序的算法吧，稍微讲一下的每个算法的执行过程。1、冒泡排序： 从第一个元素开始，把当前元素和下一个索引元素进行比较。如果当前元素较大则交换位置，重复操作到最后，这样最大值就被放到了数组末尾，下一次循环则只需要循环到length-2的位置2、插入排序： 默认第一个元素是已排序元素，取出下一个元素和当前元素进行比较，如果当前元素大则就交换位置，则此时当前的最小值是第一个元素，然后下一次取出第三个值向前对比，重复操作3、选择排序： 遍历数组，设置最小值的索引为0，如果取出的值比当前值小则替换
2020-08-27 14:12:31
321
原创 react中使用装饰器（decorators）
本文主要用于在create-react-app上使用装饰器，所以首先就需要通过create-react-app来创建项目。安装因为是脚手架所创建的项目，所以在需要自定义一些 create-react-app上的配置信息时就需要用到react-app-rewired引入 react-app-rewired 并修改 package.json 里的启动配置。由于新的 react-app-rewired@2.x 版本的关系，你还需要安装 customize-cra。yarn add react-app-re
2020-08-03 12:21:54
1395
原创 Webpack 基础流程
安装 webpack 和 webpack cliyarn add webpack webpack-cli -D创建webpack.config.dev.js开发版本下的配置文件const path = require('path')module.exports={ //模式(development，production) mode:'development', // devtool:'source-map' //入口文件，如果不配置entry
2020-07-31 23:03:13
220
原创 redux-thunk的简单使用
thunk我们常常需要在redux中实现异步的数据获取等操作，这个时候就可以用到thunk1、安装thunkyarn add redux-thunk2、创建store的时候引入中间件和配置import {createStore,applyMiddleware} from 'redux'import reducer from './reducer'import thunk from 'redux-thunk'let middleWares = applyMiddleware(thunk)
2020-07-31 23:02:10
923
原创 React Context的简述
ContextContext 设计目的是为了共享那些对于一个组件树而言是“全局”的数据，例如当前认证的用户、主题或首选语言。它类似vue的状态管理工具vuex，我们所接触的react中数据是通过props 属性自上而下（由父及子）进行传递的，但这种做法对于多层级父子关系的组件传值是极其繁琐的。这里主要讲解的是React 16.3之后的context版本，不在对老版本进行讲解。context的使用流程：1、创建context文件Mycontext，并引入createContext ：import {
2020-07-26 17:14:06
382
原创 React 中高阶组件(HOC)用法简述
简单的讲，Higher-Order Components就是一个函数，传给它一个组件，它返回一个新的组件。官网的定义：组件（HOC）是 React 中用于复用组件逻辑的一种高级技巧。HOC 自身不是 React API 的一部分，它是一种基于 React 的组合特性而形成的设计模式。具体而言，高阶组件是参数为组件，返回值为新组件的函数。const EnhancedComponent = higherOrderComponent(WrappedComponent);我们可以通过高阶组件来实现一
2020-07-25 15:15:09
1561
原创 socket.io的一些理解
socket.ioWebSocket是HTML5最新提出的规范，虽然主流浏览器都已经支持，但仍然可能有不兼容的情况，为了兼容所有浏览器，给程序员提供一致的编程体验，SocketIO将WebSocket、AJAX和其它的通信方式全部封装成了统一的通信接口，也就是说，我们在使用SocketIO时，不用担心兼容问题，底层会自动选用最佳的通信方式。因此说，WebSocket是SocketIO的一个子集。Socket.IO由两部分组成：一个服务端用于集成（可挂载）到Node.js HTTP服务器 ：socke
2020-06-28 21:21:55
229
原创 javascript中的this指向问题
全局下的this非严格模式的情况下，下面的this都是指向window的console.log(this);//window function abc(){ console.log(this);//window}对象当中的this属性描述this时，这个时候对象还没有生成，所以this指向外层的this指向。对象的方法this指向该对象本身var a = 10;var obj1 = { a: 100, c: this.a, //wi
2020-06-25 21:33:02
127
原创 call apply bind 相关认识
call apply1、 这两个东西可以执行函数function play(a,b){ console.log("让我康康")}// 可以执行函数play.call();play.apply();2、（重要）这两个玩意可以改变this 的指向fn.call(obj);//将函数中this的指向改变为这里带入的第一个参数obj// 函数中如果没有this,call就没有任何意义了,和普通的执行函数概念一样call和apply都可以改变this的指向，他们两个唯一的不同点就是???
2020-06-25 16:08:32
149
原创 数组，类数组相关知识点
创建数组var arr=new Array(10);//只写一个10相当于创建一个长度为10的空数组,括号不可为小数var arr1=[10] //只有一个10的数组，长度是1数组的相关方法改变数组的方法可以改变原数组 ???? push pop shift unshift sort reverse splicepush在数组末端添加，并返回新的长度//push 重写Array....
2020-04-12 21:54:00
138
原创 条件运算符
三目运算符//条件 ？ 条件是true返回的结果 ： 条件是false时返回的结果var max= 3 > 4 ? 3 : 4 条件语句if (条件) ;//条件中的结果不是 "",false,0,NaN,undefined,null就可以进入条件//也就是说上面那一大堆boolean值都是false循环while for do...whilefor(...
2020-04-12 20:51:09
100
转载 javascript 数据类型转换
转载源地址：https://blog.csdn.net/Charissa2017/article/details/103755644.任何内容转换为数值型Number() 转换为number类型，如果有字符存在，转换后就变成NaN；function、undefined、关键字、{ } 不能直接转换，需要先转换成字符串，再转成 Number；空数组 [ ] 、空字符串 " "、null转换成...
2020-04-06 21:42:09
110
原创 js基础，变量、常量-（数据类型）
一、js基础1.外部引入js<script src="a.js" async defer></script><script> ...</script>ES6模块化引入jsimport Box from "./js/Box.js";2.行内js的写法<button onclick="alert('aaa')">按...
2020-04-06 20:42:05
128
原创 路由组件的传参
※部分文字解释来源于vue官方文档????路由组件传参????路由组件传参在组件中使用 $route 会使之与其对应路由形成高度耦合，这里有违背高内聚低耦合的设计标准，从而使组件只能在某些特定的 URL 上使用，限制了其灵活性。$route 的方式进行传值???? <div id="app"> <ul> <router-link ...
2020-04-03 21:17:51
388
原创 全局混入、局部混入
混入混入 (mixin) 提供了一种非常灵活的方式，来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被“混合”进入该组件本身的选项。vue文档链接：混入-Vue.js我们暂时从全局混入的角度来讲述它的一些特性全局混入在main.js中定义mixin，在需要的使用的页面直接使用，不需要再引入（使用方法同局部混入）属性合并当...
2020-04-03 02:53:35
1435
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人