HTSC 十二月 14, 2021

项目问题答疑笔记

文章字数 2k 阅读约需 2 mins. 阅读次数 1000000

1、dva 使用方式和官网不太一样,项目中基于dva框架进行了怎么了改造?

https://dvajs.com/

改变:
1、项目信息、构建脚本:  roadhog - webpack构建脚本
入口 、 配置etc

2、路由 dva/router - +

3、动态加载  dva/dynamic - react-loadable/dynamic
https://github.com/jamiebuilds/react-loadable


4、其他:dva/fetch、dva API、Model  大致一样

2、路由路径、model一起注册? 封装的逻辑?

/** 组件动态加载 **/
1、# dva/dynamic
// app: dva 实例,加载 models 时需要
// models: 返回 Promise 数组的函数,Promise 返回 dva model
// component:返回 Promise 的函数,Promise 返回 React Component
import dynamic from 'dva/dynamic';

const UserPageComponent = dynamic({
  app,
  models: () => [
    import('./models/users'),
  ],
  component: () => import('./routes/UserPage'),
});

2、# react-loadable/dynamic
// opts 可配置项多
import dynamic from 'react-loadable';
import Loading from './my-loading-component';

const LoadableComponent = dynamic({
  loader: () => import('./my-component'),
  loading: Loading,
});

export default class App extends React.Component {
  render() {
    return <LoadableComponent/>;
  }
}

3、dva的model之前
model什么时候被加载? 当加载model的组件被卸载时,该model还存在吗?
存在的话数据应该怎么处理,组件卸载数据改如何重置?

## 背景
# react-redux provider
provider包裹在根组件外层,使所有的子组件都可以拿到state
它接受store作为props,然后通过context往下传,这样react中任何组件都可以通过context获取store

img

## model
model 与组件状态 互相独立
# Q :model什么时候被加载? 当加载model的组件被卸载时,该model还存在吗?存在的话数据应该怎么处理,当model再起启动时?数据改如何重置?
A:

## 组件内状态
react Component
# props 
读性和不变性,外部主动传入,变化时重新渲染
# state
组件内状态,私有属性,可变,变化时重新渲染,生命周期仅在组件内

@Browser Confusing String

test
申绍强
申 logo

0%