在 function 返回中同時渲染文本和 FontAwesome 圖標

Question

我正在嘗試使用 moment 格式化日期，如下所示： let formattedStartDate = moment(startDate).format('YYYY-MM-DD'); `

后來嘗試從同一個 function 中返回該格式化日期以及 FontAwesomeIcon object。 到目前為止，我的嘗試看起來像這樣：

return `${formattedStartDate} <FontAwesomeIcon icon={faArrowRight}/>`;

但是，這會正確顯示日期，但 [Object object] 代替了圖標。 I understand that this is because the FontAwesome object is indeed an object, but I'm unsure as to how to go about returning the actual icon from the same function. 任何指導將不勝感激。

謝謝你。

編輯： function 的 Rest：

formatDateRange(startDate, endDate) {
        let formattedStartDate = moment(startDate).format('YYYY-MM-DD');
        let formattedEndDate = moment(endDate).format('YYYY-MM-DD');

        return (
            <>
            {formattedStartDate + ' '}
            <FontAwesomeIcon icon={faArrowRight}/>
            {formattedEndDate}
            </>
        )
    }

Answer 1

反引號允許對JavaScript字符串進行插值 - 但您想渲染 React 元素，因此請改用 JSX 語法。

return (<>
  {formattedStartDate + ' '}
  <FontAwesomeIcon icon={faArrowRight}/>
</>)