老师您好,其他的问题都解决了,就是点击加载更多的时候报错!说loadMore里面的setState的属性是null
来源:19-1 点击加载更多-上拉刷新加载数据
觅渡qhy
2017-08-20
以下是我的代码,loadMore连1都不弹出来,老师请问下这个会是哪里的问题呢?
import React,{Component} from 'react'; import { Card,Row,Col } from 'antd'; import {BrowserRouter as Router,Route,hashHistory,Link} from 'react-router-dom'; import '../css/mobile.less'; import Tloader from 'react-touch-loader'; class MoblieList extends Component{ constructor(){ super(); this.state={ news:'', count:5, hasMore:0, initializing:1, canRefreshResolve:1, refreshedAt:Date.now() }; } componentWillMount(){ var myFetchOptions={ method:"GET" }; fetch("http://newsapi.gugujiankong.com/Handler.ashx?action=getnews&type=" + this.props.type + "&count=" + this.props.count, myFetchOptions) .then(response => response.json()) .then(json =>{ console.log(json); this.setState({news: json}) }); } //加载 loadMore(resolve){ alert(1) setTimeout(()=>{ var count=this.state.count; this.setState({ count:count+5 }) var myFetchOptions={ method:"GET" }; fetch("http://newsapi.gugujiankong.com/Handler.ashx?action=getnews&type=" + this.props.type + "&count=" + this.state.count, myFetchOptions) .then(response => response.json()) .then(json =>{ this.setState({ hasMore:count>0&&count<50 }); }); resolve(); },2e3) }; componentDidMount(){ setTimeout(()=>{ this.setState({ hasMore:1, // 初始化完成 initializing:2 }) },2e3) } refresh=(resolve, reject)=>{ alert('refresh') } toggleCanReresh(){ this.setState({canRefreshResolve:!this.state.canRefreshResolve}); } render(){ const {news}=this.state; let newsList=news.length? news.map((e,i)=>{ return( <section key={i} className="m_article list-item special_section clearfix"> <Link to={`/details/${e.uniquekey}`} className="clearfix"> <div className="m_article_img"> <img src={e.thumbnail_pic_s} alt={e.title} /> </div> <div className="m_article_info"> <div className="m_article_desc clearfix"> <div className="m_article_title"> <span>{e.title}</span> </div> <div className="m_article_desc_l"> <span className="m_article_channel">{e.realtype}</span> <span className="m_article_time">{e.date}</span> </div> </div> </div> </Link> </section>)}) : '没有加载到任何新闻' var { hasMore, initializing, refreshedAt, canRefreshResolve } = this.state; var { refresh, loadMore, toggleCanReresh } = this; return( <div className="topNewsList"> <Row span={24}> <Tloader className="main" autoLoadMore={true} onRefresh={this.refresh} onLoadMore={this.loadMore.bind(this)} hasMore={hasMore} initializing={initializing}> {newsList} </Tloader> </Row> </div> ) } } export default MoblieList
写回答
4回答
-
Parry
2017-08-27
知道你哪里错了。
setTimeout(function () {
this.setState({count:count+5});}.bind(this), 2000)
应该是这样写,你好好理解 this 的作用域。032017-08-28 -
觅渡qhy
提问者
2017-08-22
我用的是cli脚手架配置的,会不会less没有加上,但是我执行 npm-watch的时候less会编译成css文件。。。样式好像也没问题,如果这个插件不行,还有其他办法能解决吗?有没有其他的插件可以代替这个的?
022017-08-25 -
Parry
2017-08-21
你没有认真看课程,你看我写的有一行
var { refresh, loadMore, toggleCanReresh } = this;
022017-08-22 -
觅渡qhy
提问者
2017-08-20
源码的错误 在130083行
022017-08-31
相似问题