原创 redux1 - 20行代碼實現redux
手寫實現redux，react-redux的api，中間件原理 redux源碼參考 準備工作 首先建一個React的腳手架項目， 刪除src下的所有東西，保留一個空的 index.js 當前目錄 index.html <!DO
2020-06-06 12:37:22
原创 redux4 - 處理有多個 reducer時如何合併，以及實現 combineReducers
參考源碼redux倉庫 redux原則之一就是單一性，即狀態，倉庫，reducer都是唯一的，但在組件式的技術開發中，爲了好管理狀態，通常一個組件，或嵌套組件對應一個 reducer， 最後再合併成一個大的reducer 代碼太
2020-06-06 12:37:22
原创 react-router2 - 實現 HashRouter 和 Route組件理解實現原理
參考源碼庫的Router.js 原生庫的使用 官方路由使用效果演示 實現思路 1. 先導出倆組件 react-router-dom / index.js import Route from './Route'; import
2020-06-06 12:37:22
原创 使用 一個小 案例演示 vuex 在真實項目 開發中的 輔助 函數 的使用
創建 項目 demo .... 略過 , 選項 直選了 vuex ，其它的 沒有選..................................................... demo很簡單， 就是 通過 異步調接口 ，處
2020-06-06 12:37:22
原创 redux6 - 實現 react-redux 前置技能react 高階組件的使用
react-redux使用演示 代碼太多，就放codesandbox.io 了，可以看到，在組件中連接倉庫和組件的一個重要方法， connect() ，該方法的返回值就是個高階組件 什麼是高階組件 高階組件： 同高階函數，參
2020-06-06 12:37:22
原创 redux7 - 手寫實現 react - redux 基本功能 Provider 和 connect
參考reac-redux 庫 源碼 以下實現的功能代碼演示地址 使用react-redux庫 官方 react-redux 庫，使用 index.js import React from 'react'; import React
2020-06-06 12:37:21
原创 redux2 - 原生html頁面和react中使用自己手寫的 - redux
原生html頁面中 redux.js // 創建倉庫 function createStore(reducer) { let currData; let listeners = []; const getState =
2020-06-06 12:37:21
原创 reactRouter1 - 路由實現原理(hash, history)
實現原理 1. 利用hash和history這兩種模式的底層api實現對路經的切換 2. 根據匹配到的路徑，渲染對應的組件 hash模式原理 通過監聽 hashchange 事件， 在回調裏拿到 window.location
2020-06-06 12:37:21
原创 redux3 - 通過提交函數派發action及 手寫 實現 bindActionCreators 函數
redux源碼參考 dispatch 即可以是提交一個對象的語法， 還可以提交一個函數的寫法 直接通過提交函數派發動作 import React, { Component } from 'react'; import Reac
2020-06-06 12:37:21
原创 react-router3 - 利用 path-to-regexp 實現路徑及參數的匹配
上節代碼也看到了， 在判斷的時候，是直接拿 props上傳的 path 和 監聽到的 pathname作的全等比較 那這樣的話，如果手動傳入 /about/1, /about/page/2 這樣的路徑就匹配不到了, 肯定會返回
2020-06-06 12:37:21
原创 redux5 - 實現 react-redux 前置技能之 react庫的context的使用
參考redux倉庫的src目錄，初步手寫實現了以下3個方法 createStore() ： 創建數據倉庫，導出了3個方法（dispacth，subscribe，getState） combineReducers()：合併多個小
2020-06-06 12:37:21
原创 redux8 - redux 中間件 和 applyMiddleware 及其實現原理
參考redux倉庫， redux-logger庫 所有1-8系列代碼倉庫 新建個項目吧 - 引入 redux， react-redux 中間件執行流程圖 演示代碼倉庫 就這個演示了，點擊 + 1 ，現在呢， 我想打印個
2020-06-06 12:37:21
原创 Vue源碼系列-6- computed計算屬性的實現原理
計算屬性默認是有緩存的，內部實現參考源碼 src/core/instance/state.js 調用initComputed() 方法,創建 watcher /** * 初始化 computed * @param {*} v
2020-03-30 21:01:26
原创 vue 遞歸菜單樹
做一個後臺管理系統, 很多時候是不會只有一兩層這種定死的數據結構的, 往往,我們不知道它會有多少層數據, 這就需要我們來遞歸渲染, 而再react中我們遞歸個菜單就比較方便, 跟平時寫遞歸函數差不多, 而在vue中,我們就需要遞歸組件了
2020-02-22 22:15:37
原创 springboot的jwt登錄驗證
代碼量不多， 就直接上代碼了 public class TokenUtil { /** * 過期時間15秒 */ protected static final long EXPIRE_TIME = 1
2020-02-22 22:15:37