Question

我刚开始使用React，当我尝试进行Ajax调用时，遇到了一些麻烦。

我得到了：

内联JSX脚本：29 Uncaught TypeError：无法读取属性＆＃39; post＆＃39;为null

而且我不知道为什么我会收到错误。

我已经过测试，如果我从渲染函数中取出{this.state.post}，则alert(data)正在正确响应。

有人可以帮帮我吗？

   <script type="text/jsx">

        var SomeComponent = React.createClass({

            render: function(){
                return(
                            <h3>{this.props.header}</h3>
                    );
            }
        });

        React.render( <SomeComponent header="Dette er en tittel :)"/>, document.getElementById('content'));

        var EinarsComponent = React.createClass({

            componentDidMount: function(){
            $.ajax({
                url: "https://api.bring.com/shippingguide/api/postalCode.html",
                data: {clientUrl: "localhost", pnr: "4879"},
                success: function(data){
                    this.setState({post: data});
                    alert(data);
                }.bind(this)    
            });
        },
            render: function(){

                return(         
                        <div>{this.state.post}</div>
                    );
            }
        });

        React.render(<EinarsComponent />, document.getElementById('hei'));
    </script>

Answer 1

永远不会设置组件的初始状态，默认为null。在组件中添加函数getInitialState：

getInitialState: function(){
  return {
    post: null // Or some other default value that you fancy
  };
}

TypeError：无法读取属性＆＃39; post＆＃39; of null＆＃34;

1 个答案: