Meilisearch客户端完美改造

Meilisearch客户端完美改造_第1张图片

关键部分:原来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 (
      
        {parsedHit.map((part, index) =>
          part.isHighlighted ? (
            {part.value}
          ) : (
            {part.value}
          )
        )}
      
    )
  }
)

其它改造不说了,没什么惊喜。

你可能感兴趣的:(前端,html,javascript)