• 로그인
  • 장바구니에 상품이 없습니다.

home2 게시판 React 게시판 props 오류

props 오류

3 글 보임 - 1 에서 3 까지 (총 3 중에서)
  • 글쓴이
  • #102790

    이용준
    참가자
    import './App.css';
    import './layout.css';
    import './write.css';
    import { useState } from 'react';
    import ApiTest from './ApiTest';
    import WriteModal from './WriteModal';
    function App() {
    let [title, setTitle] = useState(['3.글제목','2.글제목','1.글제목']);
    let [clickTitle, setClickTitle] = useState('');
    let [count, setCount] = useState([0, 0, 0]);
    let [modal, setModal] = useState(false);
    let [writeModal, setWriteModal] = useState(false);
    let [backgroundCover, setBackgroundCover] = useState(false);
    const toggleBackgroundCover = () => {
    setBackgroundCover(!backgroundCover);
     };
    return (
    <>
    {backgroundCover && <BackgroundCover />}
    <div className='navBar'>
    <h1>ReactBlog</h1>
    </div>
    <div className='title'>
    <h2>글 목록</h2>
    <button className='sort' onClick={() => {
    let copy = [...title];
    setTitle(copy.sort());
     }}>순서정렬</button>
    </div>
    
      { title.map(function(a, i){ return( <li className='list' key={a}> <h3 onClick={()=>{ setClickTitle(title[i]); setModal(!modal)}}>{title[i]} <span style={{cursor:'pointer'}} onClick={(e)=>{ e.stopPropagation(); let copy = [...count]; copy[i] = copy[i]+1; setCount(copy)}}> 👍 </span> {count[i]} </h3> <p>10월 16일 발행</p> ) }) }
    <button onClick={()=> {setWriteModal(!writeModal); toggleBackgroundCover();}}>글쓰기</button> { writeModal ? <WriteModal></WriteModal> : null } { modal ? <Modal></Modal> : null } {/*<ApiTest></ApiTest>*/} </> ); };
    <WriteModal></WriteModal>
    function BackgroundCover(props){
    return(
    <div className='backgroundCover'></div>
     )
    }
    function Modal(props){
    return (
    <div className='modal'>
    <h4>제목 : {props.title} </h4>
    <p>날짜 : </p>
    <p>상세내용 : </p>
    <button onClick={()=> props.changeTitle}>글수정</button>
    </div>
     )
    };
    export default App;
    ----------------------------------------------
    
    import React, {useState} from "react";
    function WriteModal(props){
    let [inputValue, setInputValue] = useState('');
    return (
    <div className='writeModal'>
    <input type='text' placeholder='제목을 입력하세요' className='titleText'></input>
    <textarea placeholder='내용을 입력하세요' className='commentText'></textarea>
    <button className='submit' onClick={(e)=>{
    setInputValue(e.target.value);
    let copy = [...props.title];
    copy.unshift(inputValue);
    props.setTitle(copy);
     } }>글발행</button>
    </div>
     )
     };
    export default WriteModal;
    
    WriteModal 에서 props.title is not iterable 오류가 나옵니다 ... (2틀째 봐도 모르겠습니다.)
    #102800

    codingapple
    키 마스터
    <WriteModal> 에 title이라는 props전송을 안한듯요
    #102814

    이용준
    참가자
    감사합니다;; 바로 해결했습니다.
3 글 보임 - 1 에서 3 까지 (총 3 중에서)
  • 답변은 로그인 후 가능합니다.

About

현재 월 700명 신규수강중입니다.

  (09:00~20:00) 빠른 상담은 카톡 플러스친구 코딩애플 (링크)
  admin@codingapple.com
  이용약관, 개인정보처리방침
ⓒ Codingapple, 강의 예제, 영상 복제 금지
top

© Codingapple, All rights reserved. 슈퍼로켓 에듀케이션 / 서울특별시 강동구 고덕로 19길 30 / 사업자등록번호 : 212-26-14752 온라인 교육학원업 / 통신판매업신고번호 : 제 2017-서울강동-0002 호 / 개인정보관리자 : 박종흠