代码笔记

后台写完了要写个落地页，自己css太菜了，找个现成的吧.

发现这个项目挺好https://github.com/ant-design/ant-design-landing，相当于低代码吧。

编辑器 里面随便点点很快就能生成一个react页面，还可以直接整合到umijs项目里面.

和其他xx开源的项目一样，kpi产物不少，代码放出来就不维护了，在线demo体验很好，一放到本地跑起来就疯狂报错，这个项目也是年久失修无人维护，代码里用的ant motion的用法太旧了没法用

首先是代码下载下来后，由于没有package.json文件，需要手动安装依赖

npm install antd enquire-js rc-queue-anim rc-scroll-anim rc-tween-one --save;
npm install rc-banner-anim --save;// 如果用的是多屏滑动型的 banner，加上这条;
npm install @ant-design/compatible --save;// 如果使用了 Content7 模块，请加上这条;

Feature5的报错

报错1

Warning: React.jsx: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

Check your code at Feature5.jsx:40.

报错2

Uncaught TypeError: Cannot read properties of undefined (reading 'isTweenOne')

这个动画组件应该是更新了，写法还是旧的，就会报错，懒的看api了，直接把TweenOne.TweenOneGroup都替换成div包裹就好了

Feature6数值统计

轮播组件报错

TypeError: Cannot read properties of null (reading 'childRefs')

Uncaught Error: Argument appears to not be a ReactComponent. Keys: goTo,autoPlay,innerSlider,prev,next

代码里把QueueAnim组件替换成div就行，就是动画没了,还会导致点击时Carousel走马灯不切换

//给走马灯加一个ref
<AntCarousel
          {...carouselProps}
          key="carousel"
          infinite={false}
          beforeChange={this.onBeforeChange}
          ref={this.carouselRef}
        >
          {childrenToRender}
        </AntCarousel>
//click事件里手动切换
onTitleClick = (_, i) => {
  this.carouselRef.current.goTo(i);
};