xujing 5 years ago
parent
commit
00dbd4e161
2 changed files with 65 additions and 64 deletions
  1. 19
    39
      src/pages/project/newsbanner/index.js
  2. 46
    25
      src/pages/shop/banner/index.js

+ 19
- 39
src/pages/project/newsbanner/index.js View File

9
   };
9
   };
10
 
10
 
11
   state = {
11
   state = {
12
-    lastCity: undefined,
13
     list: [],
12
     list: [],
14
-    current: 0,
15
   }
13
   }
16
 
14
 
17
-  timer = null;
15
+  componentDidMount() {
16
+    console.log('资讯componentDidMount')
17
+    this.getNewsData()
18
+  }
19
+
20
+  componentDidShow() {
21
+    console.log('资讯componentDidShow')
22
+    this.getNewsData()
23
+  }
18
 
24
 
19
-  componentWillReceiveProps(nextProps) {
25
+  componentDidHide() {
26
+    this.setState({
27
+      list: []
28
+    })
29
+  }
20
 
30
 
21
-    // if (nextProps.cityId != this.state.lastCity) {
31
+  getNewsData() {
22
     const payload = {
32
     const payload = {
23
       pageNumber: 1,
33
       pageNumber: 1,
24
       pageSize: 999,
34
       pageSize: 999,
25
-      cityId: nextProps.cityId,
35
+      cityId: this.props.cityId,
26
     }
36
     }
27
-
28
     queryNewsList(payload).then(res => {
37
     queryNewsList(payload).then(res => {
29
-      if (JSON.stringify(this.state.list) !== JSON.stringify(res.records || [])) {
30
 
38
 
31
-        this.setState({
32
-          list: res.records || [],
33
-          lastCity: nextProps.cityId,
34
-          current: 0,
35
-        }, () => {
36
-          this.props.showNesBox(!!(res.records || []).length)
39
+      this.setState({
40
+        list: res.records || [],
41
+      })
37
 
42
 
38
-          if (this.state.list.length > 1) {
39
-            this.clearTimer()
40
-            this.timer = setInterval(() => {
41
-              let current = this.state.current + 1
42
-              if (current >= this.state.list.length) {
43
-                current = 0
44
-              }
45
-
46
-              this.setState({ current })
47
-            }, 3000)
48
-          }
49
-        })
50
-      }
51
     })
43
     })
52
-    // }
53
   }
44
   }
54
 
45
 
55
-  clearTimer = () => {
56
-    if (this.timer) {
57
-      clearInterval(this.timer)
58
-      this.timer = null
59
-    }
60
-  }
61
-
62
-  componentWillUnmount() {
63
-    this.clearTimer()
64
-  }
65
 
46
 
66
   render() {
47
   render() {
67
     if (!this.state.list.length) return null;
48
     if (!this.state.list.length) return null;
77
             className='notice-swiper'
58
             className='notice-swiper'
78
             circular
59
             circular
79
             vertical="true"
60
             vertical="true"
80
-            current={this.state.current}
81
           >
61
           >
82
             {
62
             {
83
               this.state.list.map((item, inx) => {
63
               this.state.list.map((item, inx) => {

+ 46
- 25
src/pages/shop/banner/index.js View File

9
     list: [],
9
     list: [],
10
     onClick: function () { }
10
     onClick: function () { }
11
   }
11
   }
12
+  state = {
13
+    visiable: true
14
+  }
15
+
16
+  componentDidHide() {
17
+    console.log('加载页面啦红红火火恍恍惚惚')
18
+
19
+    this.setState({
20
+      visiable: false
21
+    })
22
+  }
23
+  componentDidShow() {
24
+    this.setState({
25
+      visiable: true
26
+    })
27
+  }
28
+
29
+  componentWillMount() {
30
+    console.log('componentWillMount#######')
31
+  }
12
 
32
 
13
   onBannerClick(item) {
33
   onBannerClick(item) {
14
     this.props.onClick(item)
34
     this.props.onClick(item)
15
   }
35
   }
16
   render() {
36
   render() {
17
-    const { list, indicatorDots} = this.props
37
+    const { list, indicatorDots } = this.props
18
     return (
38
     return (
19
       <View className='home-banner'>
39
       <View className='home-banner'>
20
-        <Swiper
21
-          className='home-banner__swiper'
22
-          circular
23
-          autoplay
24
-          indicatorDots={indicatorDots}
25
-          indicatorActiveColor='rgb(178, 42, 49)'
26
-        // TODO 目前 H5、RN 暂不支持 previousMargin、nextMargin
27
-        // previousMargin
28
-        // nextMargin
29
-        >
30
-          {list.map((item, index) => (
31
-            <SwiperItem
32
-            key={index+'swiper3'}
33
-              onClick={this.onBannerClick.bind(this, item)}
34
-              className='home-banner__swiper-item'
35
-            >
36
-              <Image
37
-                mode="aspectFill"
38
-                className='home-banner__swiper-item-img'
39
-                src={transferImage(item.image)}
40
-              />
41
-            </SwiperItem>
42
-          ))}
43
-        </Swiper>
40
+        {
41
+          this.state.visiable && <Swiper
42
+            className='home-banner__swiper'
43
+            circular
44
+            autoplay
45
+            indicatorDots={indicatorDots}
46
+            indicatorActiveColor='rgb(178, 42, 49)'
47
+
48
+          >
49
+            {list.map((item, index) => (
50
+              <SwiperItem
51
+                key={index + 'swiper3'}
52
+                onClick={this.onBannerClick.bind(this, item)}
53
+                className='home-banner__swiper-item'
54
+              >
55
+                <Image
56
+                  mode="aspectFill"
57
+                  className='home-banner__swiper-item-img'
58
+                  src={transferImage(item.image)}
59
+                />
60
+              </SwiperItem>
61
+            ))}
62
+          </Swiper>
63
+        }
64
+
44
       </View>
65
       </View>
45
     )
66
     )
46
   }
67
   }