pages/document client/index 질문입니다
588
작성한 질문수 19
선생님 /profile 접속하니 아래와 같은 에러가 뜨는데
구글링해도 안나와서 도움요청드립니다
TypeError: Invalid attempt to spread non-iterable instance. In order to be iterable, non-array objects must have a [Symbol.iterator]() method.
이부분만 구글링했을땐 뜻은 알겠는데 아래처럼
내부파일들 에러가 뜨니 모르겠네요 ㅠ
Unhandled Runtime Error
TypeError: Invalid attempt to spread non-iterable instance. In order to be iterable, non-array objects must have a [Symbol.iterator]() method.
Source
client\index.tsx (473:6) @ renderReactElement
471 | }
472 | } else {
> 473 | ReactDOM.render(reactEl, domEl, markRenderComplete)
| ^
474 | }
475 | }
476 | }Server Error
TypeError: Invalid attempt to spread non-iterable instance. In order to be iterable, non-array objects must have a [Symbol.iterator]() method.
This error happened while generating the page. Any console logs will be displayed in the terminal window.
Source
pages\_document.tsx (91:33) @ Function.getInitialProps
89 | }
90 |
> 91 | const { html, head } = await ctx.renderPage({ enhanceApp })
| ^
92 | const styles = [...flush()]
93 | return { html, head, styles }
94 | }답변 2
0
server안 pages안 profile 파일이 profile.jsx 이죠?
자동으로 만들어진파일이라 에러안생길줄 알았는데 ㅠ
node_modules\react-dom\cjs\react-dom-server.node.development.js:39 이런 에러가
한 8개정도 터미널에 뜨는데 찿아도 고칠줄 모르겠고 ㅠ
혹시 다른분들도 이런에러 뜨나요? 제 vs만 이상한건가 궁금하네요
0
선생님 알려주신대로 해본결과
profile.js에 <NicknameEditForm> 만 썻을땐 검색창만 출력이 잘되는데
<FollowList>를 쓰니까 에러가 뜨네요 ㅠㅠ
import Head from "next/head";
import React from "react";
import AppLayout from "../components/AppLayout";
import FollowList from "../components/FollowList";
import NicknameEditForm from "../components/NicknameEditForm";
const Profile = () => {
const followerList = [{nickname:'나이스'}, {nickname:'킴'}, {nickname:'노드버드'}];
const followingList = [{nickname:'나이스'}, {nickname:'킴'}, {nickname:'노드버드'}];
return (
<>
<Head>
<title>내 프로필 | NodeBird</title>
</Head>
<AppLayout>
<NicknameEditForm></NicknameEditForm>
<FollowList></FollowList>
</AppLayout>
</>
);
};
export default Profile;
import React from "react";
import { Card, List, Button } from "antd";
import { StopOutlined } from "@ant-design/icons";
import PropTypes from 'prop-types';
const FollowList = ({ header, data }) => {
return (
<List
style={{ marginBottom : 20 }}
grid={{ gutter:4, xs:2, md:3 }}
header={<div>{header}</div>}
size='small'
loadMore={<div style={{textAlign:'center',margin: '10px 0'}}><Button>더보기</Button></div>}
bordered
dataSource={{data}}
renderItem={(item)=>(
<List.Item style={{ marginTop:20 }}>
<Card actions={[<StopOutlined key='stop'/>]}>
<Card.Meta description={item.nickname}/>
</Card>
</List.Item>
)}
/>
)
};
FollowList.propTypes = {
header: PropTypes.string.isRequired,
data: PropTypes.array.isRequired,
};
export default FollowList;
0
헉 비교해보며 방금 찿았는데
dataSource={{data}}
가 아니고
{data} 였네요..
자동적으로 만들어진 파일에 에러가 생기는줄 알고 멘붕했었는데
역시
제 실수였네요 ㅠㅠ
신경써주셔서 너무 감사드립니다!!!!!
0
Profile.jsx에서 에러가 있을 수 있습니다. 에러를 찾으려면 주석 처리를 해보면서 어떤 부분을 주석처리했을 때 에러가 없어지는지 확인해보면 좋습니다. 그 때 주석처리한 부분이 문제거든요.
넥스트 버젼 질문
0
79
2
로그인시 401 Unauthorized 오류가 뜹니다
0
91
1
무한 스크롤 중 스크롤 튐 현상
0
177
1
특정 페이지 접근을 막고 싶을 때
0
105
2
createGlobalStyle의 위치와 영향범위
0
97
2
인라인 스타일 리렌더링 관련
0
93
2
vsc 에서 npm init 설치시 오류
0
149
2
nextjs 15버전 사용 가능할까요?
0
160
1
화면 새로고침 문의
0
123
1
RTK에서 draft, state 차이가 있나요?
0
155
2
Next 14 사용해도 될까요?
0
452
1
next, node 버전 / 폴더 구조 질문 드립니다.
0
350
1
url 오류 질문있습니다
0
211
1
ssh xxxxx로 우분투에 들어가려니까 port 22: Connection timed out
0
378
1
sudo certbot --nginx 에러
0
1282
2
Minified React error 콘솔에러 (hydrate)
0
471
1
카카오 공유했을 때 이전에 작성했던 글이 나오는 버그
0
249
1
프론트서버 배포 후 EADDRINUSE에러 발생
0
329
1
npm run build 에러
0
519
1
front 서버 npm run build 중에 발생한 에러들
0
383
1
서버 실행하고 브라우저로 들어갔을때 404에러
0
339
2
css 서버사이드 랜더링이 적용되지 않아서 문의 드립니다.
0
289
1
팔로워 3명씩 불러오고 데이터 합쳐주는걸로 바꾸고 서버요청을 무한으로하고있습니다.
0
242
2
해시태그 검색에서 throttle에 관해 질문있습니다.
0
202
1