フリーランスのためのネットビジネス専門学校 ネットで独立開業を目指す人を応援
フリーランスのためのネットビジネス専門学校 ネットで独立開業を目指す人を応援

Reactで改行込みのデータを表示させたい時

コンテナにスタイルを当てればOK。
CSSだけで完結するのでReact以外でも使える。

import React from 'react';
import ReactDOM from 'react-dom';

const data = "hogenfuga";
const styles = { whiteSpace: 'pre-line' }; // CSSで書く場合は { white-space: pre-line }

const App = ({ children }) => (
  <div style={styles}>{children}</div>
);

ReactDOM.render(<App>{data}</App>, document.getElementById('root'));

デモ

[紹介元] CSSタグが付けられた新着投稿 – Qiita Reactで改行込みのデータを表示させたい時

コメント

記事に戻る

コメントを残す