將 JSX 傳入函式,再把回傳的 JSX 放到頁面
兩個 JSX 元素傳入 renderGoodWord 中,通過表達式,把該函數返回的 JSX 元素插入到頁面上。
import React, { Component } from 'react'
import ReactDOM from 'react-dom'
import './index.css'
class Header extends Component {
renderGoodWord (goodWord, badWord) {
const isGoodWord = true
return isGoodWord ? goodWord : badWord
}
render () {
return (
<div>
<h1>
React 小書
{this.renderGoodWord(
<strong> is good</strong>,
<span> is not good</span>
)}
</h1>
</div>
)
}
}
ReactDOM.render(
<Header />,
document.getElementById('root')
)