我怎么能使一个词更胖,并使我的字符串在反应断行?



我想让一个换行到我的字符串,使一个词更胖,但n或r不工作。我使用react和next.js。

我想让它变胖的单词是"studio",我想在"reves "后面加一个换行符。单词在"描述"中。

有人能帮我一下吗?我使用一个包含标题、描述和图像的通用可重用块,然后我调用这个块,就像我放在这里的代码一样,我添加我想要的东西这是这个block:


export interface ITheTeamBlockProps {
title?: string;
job?: string;
description?: string;
img?: {url: string, alt?: string};
className?: string;
}
export interface ITheTeamBlockState{
}
export default class TheTeamBlock extends React.Component<ITheTeamBlockProps, ITheTeamBlockState>{
render(){
const { title, job, description, img, className } = this.props;
return <>
<div className={className + 'theTeam-block'}>
<div className="theTeam-block__title">{title}</div>
<div className="theTeam-block__job">{job}</div>
{/* <div className="theTeam-block__image-box">
<img src={img.url} alt={img.alt}/>
</div> */}
<div className="theTeam-block__description">{description}</div>
</div>
</>
}
}
import React from 'react';
import BannerBottomBlock, { IBannerBottomBlockProps } from '../banners/bannerMiddleBottom';
interface ITeamBannerBottomBlockProps {
title?: string;
}
interface ITeamBannerBottomBlockState{
bannerBlockInfos: IBannerBottomBlockProps[]
}
export default class TeamBannerBottomBlock extends React.Component<ITeamBannerBottomBlockProps, ITeamBannerBottomBlockState>{
constructor(props){
super(props);
this.state = {
bannerBlockInfos: [
{
title: "Le premier lien du studio, celui d'une amitié.", 
description: `Avant même d'être un studio, Ben&Jo est une histoire d'amitié solidifiée par une passion commune, celle d'aider les autres à accomplir leurs rêves. Ainsi cette agence de communication s'est fondée sur les valeurs d'une amitié comme la transparence, l'honnêteté, la compassion, le partage et l'amour !`, 
img: { url : "/img/pages-cible/team/story-first-link.svg"},
},
]
}
}
render(){
const { bannerBlockInfos } = this.state;
return <>
<div className="team__bannerBottom">
{ bannerBlockInfos && bannerBlockInfos.map((item, index) => {
return <BannerBottomBlock key={"team__bannerBottom-block_" + index } 
{...item} className="team__bannerBottom-block"/>
})
}
</div>
</>
}
}

使用一些标签(这里我使用<>)而不是字符串周围的引号,并将<br/>放在需要换行的地方。

如果你指的是加粗,使用<strong>标签

description: <>Avant même d'être un <strong>studio</strong>, Ben&Jo est une histoire d'amitié solidifiée par une passion commune, celle d'aider les autres à accomplir leurs rêves.<br/> Ainsi cette agence de communication s'est fondée sur les valeurs d'une amitié comme la transparence, l'honnêteté, la compassion, le partage et l'amour !</> 

看到结果

相关内容

最新更新