我不知道为什么会出现此错误，我相信逻辑没有问题。

matchData[0] 包含此信息：

{    players: ["Disguised Lizard", "DrSpiteful"],
    winner: "DrSpiteful",
    scoreDifference: 1
}

以下是包含 Match(props) 信息的逻辑：

import React from 'react';
import Match from './Match';
import matchData from '../data/matchData';

function MatchList(props) {
  const oneMatch = matchData[0];
  console.log(oneMatch);
  return (
    <section className="PlayerList MatchList">
      <h1>Match list</h1>
      <Match
        players={oneMatch.players}
        winner={oneMatch.winner}
        scoreDifference={oneMatch.scoreDifference}
        />
    </section>
  );
}

export default MatchList;

我遇到了从以下代码中提取的此行 {props.players[0]} <span>vs</span> {props.players[1]> 问题：

import React from 'react';

function Match(props) {
  return (
    <article className="Match">
      <h1>
        {props.players[0]} <span>vs</span> {props.players[1]}
      </h1>
      {/* To be shown when there is a winner */}
      <h2>
        {props.winner} is the winner by {props.scoreDifference}!
      </h2>
      {/* To be shown when there is no winner */}
      <h2>No winners yet!</h2>
    </article>
  );
}

export default Match;

有人可以指出我做错了什么吗，老实说，我没有看到问题所在。