关键部分:原来Body部分显示有问题,对\n视而不见。
改造:
- // Used in Banner
- typo15: {
- tag: 'span',
- style: css`
- font-size: 15px;
- font-weight: 300;
- line-height: 25px;
- display: inline-block;
- `,
- },
- // Used in Body
- typoBody: {
- tag: 'span',
- style: css`
- font-size: 15px;
- font-weight: 300;
- line-height: 25px;
- white-space: pre-wrap;
- `,
- },
-
-
- ...
-
-
- const Highlight = connectHighlight(
- ({ highlight, attribute, hit, indexContextValue, ...props }) => {
- const parsedHit = highlight({
- highlightProperty: '_highlightResult',
- attribute,
- hit,
- })
-
- return (
- <Typography variant="typoBody" {...props}>
- {parsedHit.map((part, index) =>
- part.isHighlighted ? (
- <mark key={index}>{part.value}</mark>
- ) : (
- <span key={index}>{part.value}</span>
- )
- )}
- </Typography>
- )
- }
- )
其它改造不说了,没什么惊喜。