ImeiLau的博客

原创 VScode中将less的样式输出转为微信小程序中.wxss的样式

原创 微信小程序request封装

1、先在右上角详情中打开”增强编译“，不然小程序中不识别async，await方法。2、配置请求的公共路劲3、封装wx.request()请求4、使用封装好的wx.request()5、代码：//封装基本路劲export const BASE_URL='https://www.linweiqin.cn/api/public/v1/'//封装请求const {BASE_URL}=require('./constant')export const request=(params)=

原创 React--高阶组件

1.高阶组件初识 ：原理：就是一个函数，接收一个或多个组件作为参数，返回一个新的组件。作用：实现代码的复用React中高阶组件实现的两种方式1.属性代理: ① 操作属性props; ② 抽离state；③ 用其他元素包裹传入的组件；2.反向继承:① 操作state ②渲染劫持。渲染劫持：条件渲染、修改由render() 输出的React元素树入门小例子 （1）import React, { Component } from 'react';// 高阶组件：一个函数，接收一个或多个组件作

原创 React组件通信-兄弟传值

原理 :其实就是通过子组件1向父组件传值后，父组件将其传过来的值储存起来，又利用父向子传值给子组件2，从而实现两个兄弟组件之间的传值图片逻辑 ：代码演示import React, { Component } from 'react';// 子组件1：const Demo=(props)=>{ return ( <div> <h1>Demo组件</h1> {/* 3.在子组件中将传递进来的方法执行，并回传信息 */

原创 React-组件通信--子向父传值

1.父组件自定义一个函数；2.将函数以自定义的方式传递给子组件 ；3.在子组件中将传递进来的方法执行，并回传信息。import React, { Component, PureComponent } from 'react';// 组件通信---子向父传值// 1.子向父：通过事件传// 备注：PurComponent也是继承与Component组件，不一样的是PureComponent在他的生命周期的shouldComponentUpdate周期里面做了浅比较，// 如果在你传进来的属

原创 React-组件-父向传子值，（内含防御性代码的使用）

组件传值 -父传子值的两种情况 ：1.类组件间的父向子传值：父组件件通过属性传值，子组件通过this.props接收父组件传过来的值import React, { Component } from 'react'//定义一个子组件class Demo extends Component{ render(){ console.log(this.props) //得到 {msg：'☺'} return ( //防御性代码 ：有时候取得数据层级太深了，数据没有拿到，导致

原创 父组件创建及创建的时候，如果有子组件，子组件会经历哪些生命周期阶段，顺序是怎样的？

经历的周期及顺序如下所示执行App组件中的constructor；执行App组件中的getDerivedStateFromProps执行App 组件中 Render函数执行子组件组件的constructor执行子组件中的getDerivedStateFromProps"执行子组件中的render函数执行子组件中的执行componentDidMount执行App组件中 componentDidMount代码演示import React, { Component } from "reac

原创 React组件生命周期---卸载时

卸载时只有一个生命周期 componentWillUnmount()详细过程见代码import React, { Component } from 'react';//组件生命周期---卸载时// 卸载时只有一个生命周期 componentWillUnmount()class Demo extends Component{ componentWillUnmount(){ console.log('点击按钮卸载Demo组件时，执行componentWillUnmount()

原创 React组件更新时经历的5个生命周期及其执行顺序

1. getDerivedStateFromProps（props,state）{}2.shouldComponentUpdate(){}判断组件要不要更新，在这个周期做优化，减少一些组件不必要的更新3. render()4.getSnapshotBeforeUpdate(prevpProps,preState){}在最近一次渲染输出之前调用，他使得组件能在发生更改之前从DOM中捕获一些信息，此生命周期的任何返回值将作为参数传递给componentDidUpdate()，用在处理滚动位置的聊天线程

原创 React挂载时使用到的生命周期

1.constructor()在这个周期中可以做的事情： 1. 初始化状态 2. 绑定this 3. 创建ref2.getDerivedStateFromProps(props,state)在这个周期中可以做的事情：当父组件更新的时候，会传一些的新的属性进来，当有的属性我有用到的时候，这里返回的对象就会去跟状态 this.state={}里的对应属性合并3.render()注意：render()中不能使用setState()方法，不然会引起无限更新this.setState({s

原创 闭包

闭包的原理就是一个作用域访问另一个函数的局部变量作用延申了变更了的作用范围一个简单的闭包例子 // function fn() { // var num = 10 // function fun() { // console.log(num) // } // return fun // } // var f = fn() //调用

原创 token的使用

前台实现（一般在请求拦截器中加token，以下只是简单示例）1.用户在点击登录接口的时候向后台发送请求，后台在返回的内容中携带了token，前端久将其set到localStorage中， document.getElementById("login").addEventListener("click", function () { let name = document.getElementById("name").value; let password = document.g