如何在 React js 中插入數據

Question

我遇到了 React JS 的問題，我想在一行中顯示所有數據，而不是在一列中。

我應該在我的代碼中更改什么？

工作演示：

https://codesandbox.io/s/nostalgic-wood-9jrib?file=/src/App.js:0-355

反應組件

import React from "react";

export default function App() {
  const names =
    data &&
    data.length &&
    data.map(({ full_name }) => <p key={full_name}>{full_name}</p>);

  return <div className="row">{names}</div>;
}

Answer 1

p ：被用作段落，因此默認情況下它將覆蓋整個寬度，除非您使用 css 覆蓋

您可以使用，

// if you need more space you can apply class to span and add some padding-mrgin
// as per your need
<span key={full_name}>{full_name} {' '}</span>

代替

<p key={full_name}>{full_name}</p>