在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ React 的一次性事件

React 的一次性事件

  1. 應用場景 首頁進入有一個loading頁面 類似廣告 點擊就可以關閉
  2. 需求是 當我點擊首頁中的其他鏈接進入其他頁面的時候 再次返回首頁不會再次出現(xiàn)loading頁面
  3. loading頁面只出現(xiàn)在進入首頁的時候

查了react 中的鉤子函數(shù) 發(fā)現(xiàn)沒有解決 請問大家有沒有類似的需求 有解決的

{loading ? <HomeLoading>
        <HomeLoadingImgs>
          <Carousel autoplay={false} infinite selectedIndex={1} >
            {this.state.data.map(val => (
              <a
                key={val}
                style={{
                  display: 'inline-block',
                  width: '100%',
                  height: this.state.imgHeight
                }}
                  >
                <img
                  src={IconLoading}
                  alt=''
                  style={{ width: '100%', verticalAlign: 'top' }}
                  onLoad={() => {
                        // fire window resize event to change height
                    window.dispatchEvent(new Event('resize'))
                    this.setState({ imgHeight: 'auto' })
                  }}
                    />
              </a>
                ))}
          </Carousel>
        </HomeLoadingImgs>
        <HomeLoadingClose onClick={() => {
          this.setState({ loading: false })
        }} src={IconLoadingClose} />
      </HomeLoading> : ''}
回答
編輯回答
怣人

你在第一次進入首頁的時候,顯示loading之后,在localStorage里邊記錄一個顯示過的狀態(tài),然后從其它頁面進入首頁的時候首先取localStorage里的狀態(tài)看看顯示過了沒有啊,顯示過了就不展示loading了。

另外,react是有一次性事件的,只不過不是說在應用程序中只執(zhí)行一次,而是說在組件生命周期中,只執(zhí)行一次哈。比如生命周期事件getDefaultProps, getInitialState ,componentWillMount,componentDidMount,componentWillUnmount

參考:React組件生命周期

2017年5月4日 02:06