相关疑难解决方法(0)

我正在使用reactjs,并且在尝试显示json数据时(无论是来自文件还是服务器)似乎无法阻止此错误:

Uncaught TypeError: this.props.data.map is not a function

我看过:

抛出"TypeError:this.props.data.map不是函数"的反应代码

React.js this.props.data.map()不是函数

这些都没有帮助我解决问题.在我的页面加载之后,我可以验证this.data.props没有未定义(并且确实有一个等价于json对象的值 - 可以调用window.foo),所以看起来它没有及时加载它被调用时ConversationList.如何确保该map方法正在处理json数据而不是undefined变量？

var converter = new Showdown.converter();

var Conversation = React.createClass({
  render: function() {
    var rawMarkup = converter.makeHtml(this.props.children.toString());
    return (
      <div className="conversation panel panel-default">
        <div className="panel-heading">
          <h3 className="panel-title">
            {this.props.id}
            {this.props.last_message_snippet}
            {this.props.other_user_id}
          </h3>
        </div>
        <div className="panel-body">
          <span dangerouslySetInnerHTML={{__html: rawMarkup}} />
        </div>
      </div>
    );
  }
});

var ConversationList = React.createClass({
  render: function() {

    window.foo            = this.props.data;
    var conversationNodes = this.props.data.map(function(conversation, index) {

      return …

新的React并试图循环Object属性但React抱怨对象无效React儿童,有人可以给我一些关于如何解决这个问题的建议吗？我添加了createFragment,但不完全确定这需要去哪里或我应采取什么方法？

JS

var tifs = {1: 'Joe', 2: 'Jane'};
var tifOptions = Object.keys(tifs).forEach(function(key) {
    return <option value={key}>{tifs[key]}</option>
});

渲染功能

render() {
        const model = this.props.model;

        let tifOptions = {};

        if(model.get('tifs')) {
            tifOptions = Object.keys(this.props.model.get('tifs')).forEach(function(key) {
                return <option value={key}>{this.props.model.get('tifs')[key]}</option>
            });
        }

        return (
            <div class={cellClasses}>

                    <div class="grid__col-5 text--center grid__col--bleed">
                        <h5 class="flush text--uppercase">TIF</h5>
                        <select id="tif" name="tif" onChange={this.handleChange}>
                            {tifOptions}
                        </select>
                    </div>

            </div>
        );
    }

控制台出错

If you meant to render a collection of children, use an array instead or wrap the object using …