Question

我有两个课程officerModals和OfficerPhoto，而officerModals应该将数据传递到OfficerPhoto。但是，当我尝试在OfficerPhoto中注销数据时，我只得到undefined。我一直在关注Reacts的教程，我不知道哪里出错了。有人可以帮忙吗？

reactReady = -> 
    officerModals = React.createClass
        getInitialState: ->
            {data: []}
        componentDidMount: ->            
            $.ajax
                url: this.props.url
                dataType: 'json'
                cache: false
                success:((data) ->
                    @setState data: data
                    # console.log data <- this logs the correct data
                    console.log @state.data.officers <- so does this
                ).bind(this)
        render: ->
            React.createElement 'div', { className: 'photos' }, React.createElement(OfficerPhoto, data: @state.data.officers)

    OfficerPhoto = React.createClass                  
        render: ->              
            React.createElement 'h1', {className: 'yes'}
        console.log 'test'                                      
        console.log @props #<- this returns undefined

    React.render React.createElement(officerModals, {url: "officers.json"}), $('#officerPics').get 0

$(document).ready reactReady
$(document).on 'page:load', reactReady

编辑：我在记录@props之前就插入了一个字符串，并且我取消注释@state.data.officers。看来OfficerPhoto正在官方模型之前呈现 - 我该如何解决？

Answer 1

这看起来像一个竞争条件。在渲染方法运行之前，您的ajax查询未返回，因此state.data.officers未定义。

Answer 2

问题是officeModals没有在OfficerPhoto上传递道具。也许使用Object.assign将解决你的问题：

React.createElement(OfficerPhoto, Object.assign({}, this.props, { data: 'values' }));

ReactJS this.props.data未定义

2 个答案: