- 博客(97)
- 收藏
- 关注
RSS订阅原创 电子地图 | VINS-FUSION | 小觅相机D系列
VINS系列|VINS-Fusion论文精读：一种通用的基于优化的多传感器局部里程计估计框架（上） - 知乎论文链接：https://arxiv.org/pdf/1901.03638.pdfGitHub链接：https://github.com/HKUST-Aerial-Robotics/VINS-Fusion 作者：自动驾驶专栏 | 原文出处：公众号【自动驾驶专栏】摘要如今，越来越多的传感器装载在机…VINS-FUSION算法总结_Lusix1949的博客-CSDN博客。
2023-10-02 12:39:27
1378
原创 Latex基本使用
一、文字加粗：\textbf{文字} 加颜色：\textcolor{颜色}{文字}，如：\textcolor{cyan}{TABLE II}
2021-02-07 15:45:17
901
原创 Python学习之旅三：python高级语法
使用pycharm。1 包1.1 模块一个模块就是一个包含python代码的文件，后缀名为.py即可，模块就是个python文件。为什么要使用模块呢？程序太大，编写维护非常不方便，需要拆分 模块可以增加代码重复利用的方式 当做命名空间使用，避免命名冲突 模块就是一个普通文件，所以任何代码都可以直接书写根据模块的规范，在模块中需要包含以下内容：函数（单一功能） 类（相似功能的组合，或者类似业务模块） 测试代码使用模块的方法：模块直接引入（加入模块命名以数字开头，需要借
2020-12-29 12:08:52
2449
3
原创 Python学习之旅二：python语法基础
使用Jupyter Notebook。因为之前已经安装过Anaconda，所以它会自动帮我们安装上Jupyter Notebook。注释行注释：#开头 块注释：三个连续单引号或双引号开始和结束变量命名规则变量名可包含大小写字母、数字、下划线等（除这三种外其他不推荐） 不可以用数字打头 python中下划线开头的变量具有特殊意义，不建议使用 大小写敏感 推荐使用有固定含义的英文单词或缩写，驼峰命名法（类名大驼峰、普通变量或函数小驼峰）或posix写法（单词全部小写，多个单词用下划线
2020-12-16 11:31:53
241
原创 Python学习之旅一：Anaconda3+Pycharm安装
环境：Windows10Anaconda3安装下载地址：https://www.anaconda.com/download/点击Windows图标，这里下载的是64位的。双击下载好的文件。一路点击向下，注意安装位置，其他保持默认选项即可。在高级安装配置这一步，同样保持了第二个选项默认使用Python3.8，第一个选项的意思是加入环境变量。等待一段时间，安装完毕。Pycharm安装下载地址：http://www.jetbrains.com/pycharm/downloa..
2020-12-09 14:13:18
266
原创 React服务端渲染框架Next.js入门之旅四：路由的6个钩子事件
钩子事件：当路由发生变化时可以监听到这些事件，从而执行对应的函数。钩子事件必须要引入router：import Router from 'next/router' 六个钩子事件如下：routeChangeStartrouteChangeStartrouterChangeCompletebeforeHistoryChangerouteChangeErrorhashChangeStarthashChangeComplete验证钩子事件在index.js中编写监
2020-11-24 12:02:36
1057
1
原创 React服务端渲染框架Next.js入门之旅三：路由跳转和参数传递
不带参数，静态路由；带参数，根据参数不同显示不同内容，动态路由。一、路由跳转标签式跳转在pages下新建juanA.js以及juanB.js作为两个跳转页面。juanA.js：import Link from 'next/link'export default ()=>( <> <div>juanA page</div> {/* 文档中规定必须放a标签,Link下只能有一个父级标签，即多个标签要用一个a
2020-11-24 11:21:59
1517
1
原创 React服务端渲染框架Next.js入门之旅二：Next.js的Page和Component使用
新建Page在pages文件夹（专门存放页面的文件夹）下新建juan.js：function Juan(){ return ( <button>Juan按钮</button> )}export default Juan启动项目：yarn devNext.js会自动配置路由。访问网址http://localhost:3000/juan：深层次的路由用文件夹来实现。假设要访问http://localhost:3000
2020-11-24 10:14:14
828
原创 React服务端渲染框架Next.js入门之旅一：创建项目
Next.js是一个轻量级的React服务端渲染应用框架。创建Next.js项目手动创建打开命令行工具，进入想要放项目的文件夹下，创建一个新的文件夹用来放置Next项目：mkdir NextDemo进入NextDemo文件夹，进行项目初始化(建立package.json)：npm init用vscode打开NextDemo，安装依赖包：npm install --save react react-dom next安装好了依赖包：手动增加一些配置项（pack
2020-11-23 22:44:11
317
原创 React Hooks学习之旅七：自定义Hooks函数
监听窗口大小案例自定义的Hooks函数命名必须以use开头。新建Example9.js文件：import React, { useState,useEffect,useCallback } from 'react';/**自定义函数命名必须use开头 *//**监控窗口大小 */function useWinSize(){ const [size,setSize] = useState({ width:document.documentElement.clien
2020-11-19 19:07:53
398
原创 React Hooks学习之旅六：useRef获取DOM元素和保存变量
useRef可以获取DOM元素和保存普通变量。获取DOM元素新建Example8.js，通过useRef获取input框DOM元素：import React, { useRef } from 'react';function Example8(){ const inputEl = useRef(null);//获取input DOM元素 const onBtnClick = ()=>{ inputEl.current.value = "Hel
2020-11-19 18:52:10
5076
原创 React Hooks学习之旅五：useMemo解决子组件重复执行问题
子组件重复执行对性能损耗非常大。在src文件夹下新建Example7.js：import React, { useState } from 'react';function Example7(){ const [xiaohong,setXiaohong] = useState('小红在代课状态'); const [zhiling,setZhiling] = useState('志玲在代课状态'); return ( <>
2020-11-19 18:27:37
1508
1
原创 ReactHooks学习之旅四：useReducer使用
增减计数器小案例新建Example5.js文件：import React, { useReducer } from 'react';function ReducerDemo(){ const [count,dispatch] = useReducer((state,action)=>{ switch(action){ case 'add':return state + 1; case 'delete':return
2020-11-19 15:12:48
255
原创 React Hooks学习之旅三：useContext父子组件传值
createContext函数创建上下文，useContext函数接收父组件传递过来的数据。新建一个Example4.js文件，实现父子组件传值：import React, { useState ,createContext , useContext } from 'react';const CountContext = createContext();//想共享的要创建上下文//声明一个子组件，接收countfunction Counter(){ let count = use
2020-11-17 17:16:00
406
原创 React Hooks学习之旅二：useEffect替代生命周期函数
useEffect可以替代生命周期函数componentDidMount和componentDidUpdate。useEffect替代componentDidMount和componentDidUpdate修改Example.js：import React, { useState,useEffect } from 'react';/**useState可以设置和改变状态 */function Example(){ const [count,setCount] = useState
2020-11-17 14:52:01
1831
原创 React Hooks学习之旅一：搭建ReactHocks学习环境
新建一个ReactHooksDemo文件夹，在该文件夹下新建React项目。create-react-app demo01
2020-11-16 19:30:57
180
原创 ReactRouter学习之旅五：后台动态获取路由进行配置
假设路由不是写死的，而是通过从后台获取的数据来动态改变，例如权限不同的人看到的页面是不一样的。那么这个时候应该怎么样去配置路由呢？这里我们通过一个数组来模拟从后台获取的数据，进行一个简单的路由配置。修改AppRouter.js文件：import React from 'react';import {BrowserRouter as Router,Route,Link} from 'react-router-dom';import Index from './Pages/Index';im
2020-11-14 20:53:03
1256
原创 ReactRouter学习之旅四：嵌套路由
要实现的小案例如下：搭建项目基础新建一个项目来完成我们的新案例：create-react-app demo02安装react-router：npm install --save react-router-dom照例清除一下src文件夹下除index.js外的其他文件。在src文件夹下新建Pages文件夹，Pages下新建video（视频教程）和workplace（职场技能）文件夹。src文件夹下新建AppRouter.js文件，AppRouter作为首页组件，首页组件一般
2020-11-14 20:34:22
231
原创 ReactRouter学习之旅三：Redirect重定向
新建一个Home组件用于重定向：import React, { Component } from 'react';//要求进入Index就重定向到Homeclass Home extends Component { constructor(props) { super(props); this.state = { } } render() { return ( <h2>我是Home组件-Redirect<
2020-11-14 10:39:03
1027
原创 ReactRouter学习之旅二：动态传值
我们让Index和List页面以列表的形式传值，点击Index中的列表某项跳转到对应改项的List页面。设置规则在AppRouter.js文件中设置List页面根据接收到的参数显示不同内容，接收参数id：<Route path="/list/:id" component={List}/>这里规定了List页面必须被传递一个参数id，因此修改一下初始地址，传递一个默认值123：<li><Link to="/list/123">列表</Link&
2020-11-14 10:12:53
223
原创 ReactRouter学习之旅一：AppRouter安装和基础环境搭建
ReactRouter是基于React的强大的路由库。安装创建一个新的项目：create-react-app XXX删除src下除index.js外的其他文件。安装react-router：npm install --save react-router-dom基础环境搭建新建AppRouter.js：import React from 'react';import { BrowserRouter as Router,Route,Link } from 'react
2020-11-13 23:51:26
384
原创 Redux学习之旅十四：React-Redux代码优化
TodoList组件中没有任何的业务逻辑，只有一个render，所以可以改写为无状态组件：import React from 'react';import { connect } from 'react-redux';const TodoList = (props) => { //js结构赋值 let { inputValue, inputChange, clickBtn, list, deleteItem } = props; return (
2020-11-13 23:01:46
102
原创 Redux学习之旅十三：React-Redux制作TodoList列表
这里没有使用Ant Design，因此样式非常简单。 TodoList.js：import React, { Component } from 'react';import {connect} from 'react-redux';class TodoList extends Component { render() { return ( <div> <div> .
2020-11-13 22:50:05
76
原创 Redux学习之旅十二：React-Redux的Provider和Connect
在index.js文件中引入Provider提供器，<Provider>下的组件都可以使用store。import React from 'react';import ReactDOM from 'react-dom';import TodoList from './TodoList';import {Provider} from 'react-redux';import store from './store';// 以下Provider中的组件或标签都可以使用store中的
2020-11-13 19:34:56
292
原创 Redux学习之旅十一：React-Redux安装
React-Redux可以简化Redux的流程。一、新建项目我们新建一个项目，重新用React-Redux来实现。create-react-app demo02删除src文件下的文件，只保留index.js文件。二、安装React-Redux新建终端，输入以下命令安装react-redux：npm install --save react-redux安装redux：npm install --save redux新建TodoList组件：import
2020-11-13 19:01:52
460
原创 Redux学习之旅十：Redux-saga的配置和使用
这里我们学的中间件都是Redux的中间件，不是React的中间件。Redux-saga也是非常常用的中间件，和Redux-thunk不相上下，但比thunk要复杂一些，这里我们也来学习一下。一、安装npm install --save redux-saga二、配置进入store/index.js，删除之前配置的thunk，引入saga：import createSagaMiddleware from 'redux-saga';store/index.js：import
2020-11-13 16:17:17
204
原创 Redux学习之旅九：Redux-thunk的使用
将后台请求数据放到中间件中来实现。在actionCreaters.js中引入axios：import axios from 'axios';新增一个函数getTodoList，将axios请求数据放到这里：export const getTodoList = ()=>{ return (dispatch)=>{ axios.get('/mock/5fa9f41e234c9b0d8babebae/ReactDemo01/xiaojiejie')
2020-11-13 15:09:24
84
原创 Redux学习之旅七：Axios结合Redux异步获取数据
因为是新建的项目，所以需要再安装一下axios：npm install --save axios
2020-11-13 08:52:59
301
原创 Redux学习之旅六：无状态组件
无状态组件只包含一个函数。使用无状态组件的原因是因为其没有state，可以省略生命周期函数，没有包含任何业务逻辑，性能比有状态组件要高。能使用无状态组件尽量使用无状态组件。在之前我们创建的TodoListUI中只包含了UI部分，可以改造为无状态组件，代码如下：import React from 'react';import 'antd/dist/antd.css';import { Input, Button, List } from 'antd';const TodoListUI =
2020-11-12 18:30:22
96
原创 Redux学习之旅五：组件UI和业务逻辑的拆分
原先的TodoList.js文件中既包含了UI部分，也包含了业务逻辑操作。为了减小耦合度和提高开发效率，我们一般将UI和业务逻辑拆分开来。将TodoList中的UI部分转移到一个新的文件TodoListUI.js中：import React, { Component } from 'react';import { Input, Button, List } from 'antd';class TodoListUI extends Component { render() {
2020-11-12 16:21:48
247
原创 Redux学习之旅四：Redux制作TodoList列表
TodoList.js文件：import React, { Component } from 'react';import 'antd/dist/antd.css';import { Input , Button ,List} from 'antd';import store from './store'; import {changeInputAction,addItemAction,deleteItemAction} from './store/actionCreaters';clas
2020-11-12 15:54:04
90
原创 Redux学习之旅三：Redux DevTools安装
安装Redux DevTools在火狐浏览器的扩展工具里搜索Redux DevTools，点击安装。安装成功F12打开控制台，会看见按照提示在store文件夹下的index.js文件中添加代码：import {createStore} from 'redux';import reducer from './reducer';const store = createStore( reducer, window.__REDUX_DEVTOOLS_EXTENSION_
2020-11-12 11:43:41
331
原创 Redux学习之旅二：创建Redux仓库store和reducer
首先要安装Redux，打开终端输入以下命令：npm install --save redux一、编写创建store仓库store是Redux工作流程中非常重要的一部分，它负责所有数据的管理。首先在src目录下新建一个store文件夹，并在store下新建index.js文件。index.js就是整个项目的store文件，该文件代码内容如下：import {createStore} from 'redux';//引入createStore方法const store = createS
2020-11-11 22:05:25
303
原创 react学习之旅十二：React动画库react-transition-group
一、安装在终端输入npm install react-transition-group --save二、使用react-transition-group插件包含三个库：Transition、CSSTransition以及TransitionGroup。使用时需要引入动画库（引入需要使用的库即可）：import { Transition, CSSTransition, TransitionGroup } from 'react-transition-group';CSSTran
2020-11-10 16:16:50
258
原创 react学习之旅十一：React远程数据请求
React使用封装的Axios请求远程数据。一、安装Axios根据项目需要在终端输入以下命令中的一条（这里我用的是npm install -save axios）：npm install axios //安装到node_modules目录下，不写入依赖npm install -g axios //安装到全局npm install -save axios //安装到生产环境中（项目跑起来必须要）npm install -save-dev axios
2020-11-10 11:03:02
258
原创 react学习之旅十：生命周期函数
一、认识React生命周期函数生命周期函数：在某一时刻组件会自动调用执行的函数。React生命周期的四个阶段：初始化阶段、虚拟DOM挂载阶段、更新阶段、DOM卸载阶段。初始化阶段：constructor：严格上来说属于ES6语法，并不是React独有的生命周期，但是可以当作React的初始阶段。挂载阶段：componentWillMount：DOM挂载之前执行。render：挂载时执行。状态state或属性props发生改变时就会重新渲染。componentDidMoun
2020-11-09 22:05:28
427
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人