MMTTMM
2023-03-18 17:05:34
<Experience startYear={2019} endYear={2019} jobName="First Job" jobDescription="1. Providing API calls support for Headless CMS.2. Provide escalated ticket/incident management support" />在這里,我想在第二點之后換行,我嘗試了 '\n' 和 br,這個標簽是通過以下代碼在 JSX 中制作的: import React, { Component } from 'react'; import { Grid, Cell } from 'react-mdl'; class Experience extends Component { render() { return( <Grid> <Cell col={4}> <p>{this.props.startYear} - {this.props.endYear}</p> </Cell> <Cell col={8}> <h4 style={{marginTop:'0px'}}>{this.props.jobName}</h4> <p>{this.props.jobDescription}</p> </Cell> </Grid> ) } } export default Experience;
2 回答

弒天下
TA貢獻1818條經驗 獲得超8個贊
我會通過將 jsx 組件作為道具傳遞給孩子,而不僅僅是原始文本。這使您可以更靈活地控制 UI 在父組件中的呈現/排序方式。
const Parent = () => (
<Child
jobDescription={(
<div style={{ flexDirection: 'column' }}>
<div>1. Providing API calls support for Headless CMS.</div>
<div>2. Provide escalated ticket/incident management support.</div>
</div>
)}
/>
)
const Child = (props) => (
<div>
<div>Child specific stuff</div>
{props.jobDescription}
</div>
)
添加回答
舉報
0/150
提交
取消