Question

我的页面文件夹具有这种结构

+---catalog
|   |   index.tsx
|   |   products.tsx
|   |
|   \---[slug]
|           index.tsx
|           products.tsx
|

问题在于，当我访问http://localhost:3000/catalog/products时，getServerSideProps收到一个查询

{
   slug: "[Object object]"
}

是的，是一个字符串，而不是一个对象，但是它应该是一个空对象，它确实起作用了，这确实使我发疯，我并没有真正触摸nextjs代码，但这是{{1} }

/catalog/products

这是import Page from './[slug]/products'; export { getServerSideProps } from './[slug]/products'; export default Page;

/[slug]/products/

这是包装纸

// react
import React from 'react';
// application
import getShopPageData from '~/store/shop/shopHelpers';
import ShopPageShop from '~/components/shop/ShopPageShop';
import { wrapper } from '~/store/store';

export const getServerSideProps = wrapper.getServerSideProps(async (context) => {
    await getShopPageData(context);
});

function Page() {
    return (
        <ShopPageShop
            layout="grid"
            gridLayout="grid-4-sidebar"
            sidebarPosition="start"
        />
    );
}

export default Page;

import { createWrapper, MakeStore } from 'next-redux-wrapper'; export const wrapper = createWrapper<IRootState>(makeStore);都在我访问我提到的URL时都收到一个字符串化的对象，而“ [Object Object]”子句会与带有子句的产品一起使用，这会导致问题。

Answer 1

尝试将[子弹]更改为[...子弹]。

Answer 2

2 个月的搜索，这是有史以来最愚蠢的问题，尝试了 chrome 和 edge，但出了点问题，我发现（我认为）有一个 chrome 扩展错过了这个，一切正常，代码是正确，我还没有真正弄清楚这是否正确，我只是使用 Firefox 来测试我的理论并且它有效。

这是发生了什么：

使用 chrome，向同一个端点发出 2 个请求，第一个获取正确的 slug，第二个获取“[object Object]”
使用 FF 或其他方式，1 次请求成功

Chrome 有超过 15 个扩展程序，我禁用了所有并进行了测试，仍然无法正常工作，我会暂时离开 chrome，直到我知道原因为止。

Nextjs在getServerSideProps中收到意外的字符串化对象查询“ [Object object]”

2 个答案: