React native React本机渲染头方法

如何调用ListView的renderHeader？ 我尝试了以下代码，但什么也没发生

this.refs.listview.props.renderHeader()

---

您需要传入一个renderHeader方法，该方法返回一个JSX元素，如下代码所示：

<ListView renderHeader={this.renderHeader} dataSource={this.state.dataSource} renderRow={this.renderRow} />

我还建立了一个非常基本的项目，演示如何做到这一点。代码也在下面。希望这能回答你的问题

“严格使用”；
var React=require（'React-native'）；
变量{
评估学，
样式表，
文本，
看法
列表视图
}=反应；
var SampleApp=React.createClass({
getInitialState:函数（）{
var ds=新的ListView.DataSource（{rowHasChanged:（r1，r2）=>r1！==r2}）；
返回{
数据源：ds.cloneWithRows（[]），
数据：[‘第1行’、‘第2行’、‘第3行’、‘第4行’、‘第5行’、‘第6行’]
}
},
componentDidMount:function（）{
var ds=新的ListView.DataSource（{rowHasChanged:（r1，r2）=>r1！==r2}）
这是我的国家({
数据源：ds.cloneWithRows（this.state.data）
})
},
renderHeader:函数（）{
返回页眉
},
renderRow:函数（数据）{
返回{data}
},
render:function（）{
返回(
);
}
});
var styles=StyleSheet.create({
容器：{
弹性：1，
为内容辩护：“中心”，
玛金托普：100
}
});
AppRegistry.registerComponent（'SampleApp'，（）=>SampleApp）；

谢谢你试图帮助我。

---

我的问题是，在向列表添加新项目后，我想更改标题样式和动画。所以我考虑重新渲染标题，但最终我将该样式和动画对象绑定到this.state，所以。。问题已解决。

您想完成什么？

'use strict';

var React = require('react-native');
var {
  AppRegistry,
  StyleSheet,
  Text,
  View,
  ListView
} = React;

var SampleApp = React.createClass({

  getInitialState: function() {
    var ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
    return { 
      dataSource: ds.cloneWithRows([]),
      data: ['row1', 'row2', 'row3', 'row4', 'row5', 'row6']
    }

  },

  componentDidMount: function() {
    var ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2})
    this.setState({
        dataSource: ds.cloneWithRows(this.state.data)
    })
  },

  renderHeader: function() {
    return <View style={{backgroundColor:'red', height:60}}><Text style={{color: 'white', fontSize:20, textAlign:'center'}}>Header</Text></View>
  },

  renderRow:function(data) {
    return <View style={{height:50, borderWidth:1, marginBottom:5}}><Text  style={{textAlign:'center'}} >{data}</Text></View>
  },

  render: function() {
    return (
      <View style={styles.container}>
        <ListView renderHeader={this.renderHeader} dataSource={this.state.dataSource} renderRow={this.renderRow} />
      </View>
    );
  }
});

var styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    marginTop:100
  }
});

AppRegistry.registerComponent('SampleApp', () => SampleApp);