Преглед на файлове

uas手机版
图表懒加载

samhoo преди 5 години
родител
ревизия
b90798b5ea

+ 1 - 0
uas-office-web/uas-mobile/package.json

@@ -25,6 +25,7 @@
     "react-dom": "^16.14.0",
     "react-file-viewer": "^1.2.1",
     "react-infinite-scroller": "^1.2.4",
+    "react-lazyload": "^3.1.0",
     "react-loadable": "^5.5.0",
     "react-redux": "^7.2.1",
     "react-router-dom": "^5.2.0",

+ 9 - 1
uas-office-web/uas-mobile/src/components/common/bizgoblin/CommonCharts.jsx

@@ -8,6 +8,8 @@ import BarGraph from './BarGraph'
 import LineChart from './LineChart'
 import PieChart from './PieChart'
 import TableChart from './TableChart'
+import LazyLoad from 'react-lazyload'
+import { forceCheck } from 'react-lazyload'
 
 export default class CommonCharts extends Component {
 
@@ -52,7 +54,13 @@ export default class CommonCharts extends Component {
     }
     return (
       <div className='common-charts' style={{ marginBottom: '8px' }}>
-        {chartItem}
+        <LazyLoad
+          once
+          height={400}
+          resize={true}
+          overflow={true}>
+          {chartItem}
+        </LazyLoad>
       </div>
     )
   }

+ 3 - 0
uas-office-web/uas-mobile/src/pages/private/homePage/HomePage.jsx

@@ -16,6 +16,7 @@ import { GlobalEvent } from '../../../utils/common/eventbus/eventbus'
 import { EVENT_DOC_FUNC_COUNT } from '../../../utils/common/eventbus/events.types'
 import { requestUserInfo } from '../../../utils/private/user.util'
 import { clearFormState } from '../../../redux/actions/formState'
+import { forceVisible } from 'react-lazyload'
 
 /**
  * Created by RaoMeng on 2020/11/9
@@ -180,6 +181,8 @@ class HomePage extends Component {
    * 切换首页
    */
   onMainTabSelected = () => {
+    //强制图表显示
+    forceVisible()
     freshHomeState({
       selectedTab: 0,
     })

+ 5 - 0
uas-office-web/uas-mobile/yarn.lock

@@ -11476,6 +11476,11 @@ react-is@^16.12.0, react-is@^16.6.0, react-is@^16.6.3, react-is@^16.7.0, react-i
   resolved "https://registry.npm.taobao.org/react-is/download/react-is-16.13.1.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Freact-is%2Fdownload%2Freact-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
   integrity sha1-eJcppNw23imZ3BVt1sHZwYzqVqQ=
 
+react-lazyload@^3.1.0:
+  version "3.1.0"
+  resolved "https://registry.npm.taobao.org/react-lazyload/download/react-lazyload-3.1.0.tgz#2d2b172ede29f0a72dc4b329af6f1626ffd637d2"
+  integrity sha1-LSsXLt4p8KctxLMpr28WJv/WN9I=
+
 react-lifecycles-compat@^3.0.4:
   version "3.0.4"
   resolved "https://registry.npm.taobao.org/react-lifecycles-compat/download/react-lifecycles-compat-3.0.4.tgz#4f1a273afdfc8f3488a8c516bfda78f872352362"