1. 首页
  2. 问题
  3. 如何在 reactjs 中两个字符串之间添加 <br> 标签？
小能豆

如何在 reactjs 中两个字符串之间添加 <br> 标签？

javascript

<br>我正在使用 React。我想在字符串之间添加换行符

“没有结果”和“请尝试其他搜索词。”。

我努力了'No results.<br>Please try another search term.'

但它不起作用，我需要<br>在 html 中添加。

有什么想法可以解决它吗？

   render() {
       let data = this.props.data;
       let isLoading = this.props.isLoading;
       let isDataEmpty = Object.entries(data).length === 0;
       let movieList = isLoading ? <Loader /> : isDataEmpty ? 'No results. Please try another search term.' :
           Object.entries(data).map((movie, index) => <MovieTile key={index} {...movie[1]} />);
       return (
           <div className='movieList'>{movieList}</div>
       );
   }

阅读 34

收藏
2024-06-12

共1个答案

小能豆

应该使用 JSX 而不是字符串：

<div>No results.<br />Please try another search term.</div>

因为每个 jsx 都应该有 1 个包装器，所以我<div>为字符串添加了一个包装器。

这是您的代码：

render() {
   let data = this.props.data;
   let isLoading = this.props.isLoading;
   let isDataEmpty = Object.entries(data).length === 0;
   let movieList = isLoading ? <Loader /> : isDataEmpty ? <div>No results.<br />Please try another search term.</div> :
       Object.entries(data).map((movie, index) => <MovieTile key={index} {...movie[1]} />);
   return (
       <div className='movieList'>{movieList}</div>
   );
}
2024-06-12