Reactjs getDefaultProps和getInitialState未按预期工作

我是reactjs的初学者。我试了一些例子。下面是我正在处理的一个程序，但是getDefaultProps和getInitialState没有按预期工作

当我没有为迎宾组件指定任何名称属性时，getDefaultProps不会返回默认名称。 当我指定getInitialState时，我的表单不会显示

var Greeter = React.createClass({
  getDefaultProps: function() {
    console.log(this.props);
    return 
    {
      name: "React";
    }
  },
  getInitialState: function() {
    return 
    {
      name: this.props.name;
    }
  },
  onButtonClick: function(e) {
    e.preventDefault();

    var name = this.refs.name.value;
    this.setState({
      name: name
    });

    //alert(name);
  },
  render: function() {
    var name = this.state.name;
    return (
      <div>
        <h1>Hi {name}</h1>
        <p>This is from the react component</p>

        <form onSubmit={this.onButtonClick}>
          <input type="text" ref="name" />
          <button>Set Name</button>
        </form>
      </div>
    );
  }
});

var name = "Lmntrix";

ReactDOM.render(<Greeter name={name} />, document.getElementById("app"));

var Greeter=React.createClass({
getDefaultProps:function（）{
console.log（this.props）；
返回
{
名称：“反应”；
}
},
getInitialState:函数（）{
返回
{
名称：this.props.name；
}
},
onButtonClick：函数（e）{
e、 预防默认值（）；
var name=this.refs.name.value；
这是我的国家({
姓名：姓名
});
//警报（名称）；
},
render:function（）{
var name=this.state.name；
返回(
你好{name}
这是来自react组件

设置名称
);
}
});
var name=“Lmntrix”；
ReactDOM.render（，document.getElementById（“app”）；

您在新行上返回了对象，我认为这导致javascript返回未定义的对象：

getDefaultProps: function ()
{
    console.log(this.props);
    return
    {
        name:"React"
    };
},
getInitialState: function()
{
    return
    {
        name: this.props.name;
    }
},

当我将代码复制到其中时，会自动添加分号，这证明了我的观点：

  getDefaultProps: function() {
    console.log(this.props);
    return;
    {
      name: "React";
    }
  },
  getInitialState: function() {
    return;
    {
      name: this.props.name;
    }
  },

因此，要解决这个问题，请尝试：

  getDefaultProps: function() {
    console.log(this.props);
    return {
      name: "React";
    }
  },
  getInitialState: function() {
    return {
      name: this.props.name;
    }
  },

---

我认为间距对输出不重要。但你对此很有信心，我也试过了，但对我来说不起作用。@AkshvirSoni这可能解决不了问题，但肯定也是个问题。谢谢@Tomasz，明白你的意思了。但我不认为我的代码是这样的，因为纠正这一点也不能获得所需的输出。