Tag:old and new

  • Toyreact project summary


    Webpack configuration optimization: { minimize: false}: each file will be placed in theevalBysourceURLThe way to open it in the browser becomes a separate file eval(‘console.log(“1″);\n\n//# sourceURL=webpack:///./main.js?’); @babel/preset-envPut the higher versionesThe grammar is translated into a lower versionesgrammar @babel/plugin-transform-react-jsxstayjsYou can usejsxgrammar let a = <MyComponent name=”a” />; //Translated into var a = createElement(MyComponent, { name: “a”, […]

  • Autorun and observe functions of mobx response to new values


    Autorun response function, commonly used for printing log, persisting or updating UI code var numbers = observable([1,2,3]);var disposer = autorun(() => console.log(sum.get())); //Output ‘6’ numbers.push(4); //Output ’10’ disposer(); numbers.push(5); //No more values are output. Observe can listen to the new and old values newvalue and oldvalue import {observable, observe} from ‘mobx’; const person = observable({ […]

  • Vue virtual DOM diff


    Virtual element node vnode What is a virtual element node?The virtual element node is the description of the real DOM node. Contains label name, label attribute description object, and child node collection. // example { tag:’div’ props:{ Key: ‘UUID’, // vnode unique key, useful when new and old vnode diff ID: ‘div’, // vnode ID […]

  • React-redux summary


    React-redux summary 1.Provider function Provider({store, context, children}){ //Contextvalue initialization const contextValue = useMemo(()=>{ const subscription = new Subscription(store); subscription.onStateChange = subscription.notifyNestedSubs; //Custom subscription model for subcomponent subscription return { store, subscription } }, [store]) const previosState = useMemo(()=> store.getState(),[store]); useEffect(()=>{ const { subscription } = contextValue; //The root node subscribes to the original store, and […]