在学习React的过程中,被粗心大意的在下踩过的各种坑

以下为坑的名单(2333

一、写JS渲染页面时,如果进行“提取组件”的写法,方法名一定要大写开头(小写开头是无法渲染的哦,关键是还不会报错。。)

  • 无效代码(其中“test1”为小写开头)
class App extends Component {
	render() {
		return (
			<div className="App">
				// 此处省略生成项目的初始代码部分
				……
				<test1 name="さつき" place="ニジゲン"></test1>
			</div>
		);
	}
}

var test1 = (obj) => <p>私の名前は {obj.name},貴方と友達になっていいですか?{obj.place}はとっても綺麗ですよ~</p>;
  • 有效代码
class App extends Component {
	render() {
		return (
			<div className="App">
				// 此处省略生成项目的初始代码部分
				……
				<Test1 name="さつき" place="ニジゲン"></Test1>
			</div>
		);
	}
}

var Test1 = (obj) => <p>私の名前は {obj.name},貴方と友達になっていいですか?{obj.place}はとっても綺麗ですよ~</p>;
  • 成功渲染的效果图
    在学习React的过程中,被粗心大意的在下踩过的各种坑