Question

从我能够从互联网上看到的，这个功能应该可行。然而，babel无法通过引用无效令牌来编译它。如果我注释出推线，一切正常。

有人可以用正确的语法帮我解决这个问题吗？

renderSuggestionText(highlightText, text) {
  const fragments = [];

  let buffer = text;
  while (buffer.length > 0) {
    const fragmentStart = text.toUpperCase().indexOf(highlightText.toUpperCase());
    if (fragmentStart > 0) {
      fragments.push(<span>{buffer.substr(0, fragmentStart)}<span>);
      fragments.push(<span className="bold">{buffer.substr(fragmentStart, highlightText.length)}</span>);

      buffer = buffer.substr(fragmentStart + highlightText.length);
    } else {
      fragments.push(<span>{buffer}<span>);
      buffer = '';
    }
  }

  return fragments;
}

Answer 1

某些span标记存在语法错误。您需要确保关闭所有代码（<span></span>）例如：

} else {
  fragments.push(<span>{buffer}<span>);
  buffer = '';
}

如果您未能关闭所有代码，Babel将始终抛出错误。应该像“Unterminated JSX ..”

应为：

  fragments.push(<span>{buffer}</span>);

将元素推送到数组

1 个答案: