[react]props에 있는 내용을 변경해도 페이지에는 이전 내용만 출력됩니다.

Question

React로 만들어진 Gantt 차트 프로그램을 사용해야 할 일이 생겨서, 오픈 프로젝트 중에 하나를 가져와 기능을 수정하려고 시도했는데, 도대체 왜 적용이 안되는 지 알 수가 없어서 질문을 올려봅니다.프로젝트 주소 : https://github.com/NikitaSmithTheOne/react-gantt-chart?tab=readme-ov-file간단히 설치를 한 후에 npm start를 하면 이런 화면이 뜨는데요.여기에 Cost와 Duration 그리고 Progress 열을 추가하려고 했습니다.해당 프로젝트에서는 columns 라고 하는 string[] 배열을 props로 받아서 TaskListHeader 컴포넌트를 정의 후 사용하고 있습니다. 그래서 columns의 배열에 사용할 column 항목들을 추가로 넣었는데도, 변경사항이 적용되지 않고 이전 값이 그대로 출력이 됩니다.export const defaultProps: TOptionalProps = { //columns: ["Name", "From", "To","Duration","Progress","Cost"], columns2: ["Name", "From", "To","Duration","Progress","Cost"], ... }, const TaskListHeader = (props: IProps & typeof defaultProps) => { // *** PROPS *** const { //columns, columns2, // style rootStyle, headerStyle, columnStyle, columnSeparatorStyle, } = props; // *** CONDITIONALS *** const headerBody: JSX.Element[] = []; columns2.forEach((column, index) => { const columnElement = ( {/* COLUMN */}

{column}

{/* SEPARATOR */} {index !== columns2.length - 1 &&

} ); headerBody.push(columnElement); }); return ( // ROOT

{/* HEADER */}

{/* BODY */} {headerBody}

); }; TaskListHeader.defaultProps = defaultProps; export default TaskListHeader; <추가한 후>제가 추가적으로 뭘 더 수정해야 정상적으로 테이블에 열이 추가되는 지, 왜 수정한 내용이 적용이 되지 않는 지 알고 싶습니다.

[react]props에 있는 내용을 변경해도 페이지에는 이전 내용만 출력됩니다.

0개의 답변

Q&A 목록