Nextjs getStaticPaths报错：未提供字符串类型的username参数

算力阿峰

2026-8-1

问题解决方向

核心报错原因

你在getStaticPaths里处理Directus返回的用户数据时犯了数组结构错误：username.data本身就是包含所有用户的数组，但你用[username.data]把它又包了一层，变成了二维数组。这导致map遍历的时候，每一项driver其实是整个用户数组，而非单个用户对象，自然取不到正确的driver.username，最终触发参数类型错误。

具体修正步骤

修正getStaticPaths的路径生成逻辑
把[username.data].map改成username.data.map，直接遍历用户数组，同时过滤掉无有效username的用户，避免无效路径：

export async function getStaticPaths() {
  const response = await fetch(`https://xxx.directus.app/users`, config).then(res => res.json());

  const paths = response.data
    .filter(driver => typeof driver.username === 'string' && driver.username)
    .map(driver => ({
      params: { username: driver.username }
    }));

  return { paths, fallback: false };
}

修复组件的JSX返回格式
你的组件返回了带HTML转义的模板字符串，不符合React/Next.js的JSX语法，会直接输出字符串而非渲染DOM，改成正常JSX：

export default function Driver({ results }) {
  // 加判断避免数组为空时报错
  if (!results.data || results.data.length === 0) {
    return <div>车手不存在</div>;
  }
  
  return (
    <div>
      <h1>{results.data[0].username}</h1>
    </div>
  );
}

优化getStaticProps的请求（可选）
用URL对象构建请求参数，避免字符串拼接的潜在问题：

export async function getStaticProps({ params }) {
  const url = new URL(`https://xxx.directus.app/users`);
  url.searchParams.append('fields', 'username');
  url.searchParams.append('[username][_eq]', params.username);

  const results = await fetch(url, config).then(res => res.json());
  return { props: { results } };
}