banner

src/pages/project/newsbanner/index.js

@@ -9,59 +9,40 @@ export default class SwiperBanner extends Component {
   };
 
   state = {
-    lastCity: undefined,
     list: [],
-    current: 0,
   }
 
-  timer = null;
+  componentDidMount() {
+    console.log('资讯componentDidMount')
+    this.getNewsData()
+  }
+
+  componentDidShow() {
+    console.log('资讯componentDidShow')
+    this.getNewsData()
+  }
 
-  componentWillReceiveProps(nextProps) {
+  componentDidHide() {
+    this.setState({
+      list: []
+    })
+  }
 
-    // if (nextProps.cityId != this.state.lastCity) {
+  getNewsData() {
     const payload = {
       pageNumber: 1,
       pageSize: 999,
-      cityId: nextProps.cityId,
+      cityId: this.props.cityId,
     }
-
     queryNewsList(payload).then(res => {
-      if (JSON.stringify(this.state.list) !== JSON.stringify(res.records || [])) {
 
-        this.setState({
-          list: res.records || [],
-          lastCity: nextProps.cityId,
-          current: 0,
-        }, () => {
-          this.props.showNesBox(!!(res.records || []).length)
+      this.setState({
+        list: res.records || [],
+      })
 
-          if (this.state.list.length > 1) {
-            this.clearTimer()
-            this.timer = setInterval(() => {
-              let current = this.state.current + 1
-              if (current >= this.state.list.length) {
-                current = 0
-              }
-
-              this.setState({ current })
-            }, 3000)
-          }
-        })
-      }
     })
-    // }
   }
 
-  clearTimer = () => {
-    if (this.timer) {
-      clearInterval(this.timer)
-      this.timer = null
-    }
-  }
-
-  componentWillUnmount() {
-    this.clearTimer()
-  }
 
   render() {
     if (!this.state.list.length) return null;
@@ -77,7 +58,6 @@ export default class SwiperBanner extends Component {
             className='notice-swiper'
             circular
             vertical="true"
-            current={this.state.current}
           >
             {
               this.state.list.map((item, inx) => {

src/pages/shop/banner/index.js

@@ -9,38 +9,59 @@ export default class SwiperBanner extends Component {
     list: [],
     onClick: function () { }
   }
+  state = {
+    visiable: true
+  }
+
+  componentDidHide() {
+    console.log('加载页面啦红红火火恍恍惚惚')
+
+    this.setState({
+      visiable: false
+    })
+  }
+  componentDidShow() {
+    this.setState({
+      visiable: true
+    })
+  }
+
+  componentWillMount() {
+    console.log('componentWillMount#######')
+  }
 
   onBannerClick(item) {
     this.props.onClick(item)
   }
   render() {
-    const { list, indicatorDots} = this.props
+    const { list, indicatorDots } = this.props
     return (
       <View className='home-banner'>
-        <Swiper
-          className='home-banner__swiper'
-          circular
-          autoplay
-          indicatorDots={indicatorDots}
-          indicatorActiveColor='rgb(178, 42, 49)'
-        // TODO 目前 H5、RN 暂不支持 previousMargin、nextMargin
-        // previousMargin
-        // nextMargin
-        >
-          {list.map((item, index) => (
-            <SwiperItem
-            key={index+'swiper3'}
-              onClick={this.onBannerClick.bind(this, item)}
-              className='home-banner__swiper-item'
-            >
-              <Image
-                mode="aspectFill"
-                className='home-banner__swiper-item-img'
-                src={transferImage(item.image)}
-              />
-            </SwiperItem>
-          ))}
-        </Swiper>
+        {
+          this.state.visiable && <Swiper
+            className='home-banner__swiper'
+            circular
+            autoplay
+            indicatorDots={indicatorDots}
+            indicatorActiveColor='rgb(178, 42, 49)'
+
+          >
+            {list.map((item, index) => (
+              <SwiperItem
+                key={index + 'swiper3'}
+                onClick={this.onBannerClick.bind(this, item)}
+                className='home-banner__swiper-item'
+              >
+                <Image
+                  mode="aspectFill"
+                  className='home-banner__swiper-item-img'
+                  src={transferImage(item.image)}
+                />
+              </SwiperItem>
+            ))}
+          </Swiper>
+        }
+
       </View>
     )
   }