Kyutae

deblog/.gitignore

@@ -4,8 +4,11 @@
 /node_modules
 /.pnp
 .pnp.js
+
+
 # api
-./component/server/Auth.js
+server
+
 
 
 # testing

deblog/src/component/guestbook/Book.js

@@ -34,15 +34,25 @@ const Book = () => {
 
             }).then(res => {
                 const { data } = res;
+                console.log(data)
                 setBook(data)
             }).catch(err => {
                 console.log(err)
             })
         }
         receiveServer();
     }, [chechBook]);
+    const deletData = async () => {//삭제기능 코드
+        await api.delete("about/comments/clear", {
+
+        }).catch(err => {
+            console.log(err)
+        })
+    }
+
     return (
         <StyledBook>
+            <button onClick={deletData}>삭제</button>
             <BookForm />
             {book && book.map(element => (
                 <BookContents

deblog/src/component/guestbook/BookContents.js

@@ -34,9 +34,10 @@ p.contents{
 
 const BookContents = (props) => {
 
-    const { writername, body } = props.items
+    const { writername, body, docType } = props.items
     return (
         <StyledBookContents>
+            <p className="name">{docType}</p>
             <p className="name">{writername}</p>
             <p className="contents">{body}</p>
         </StyledBookContents>

deblog/src/component/guestbook/BookForm.js

@@ -3,6 +3,7 @@ import BookContentInput from "./BookContentInput";
 import BookNameInput from "./BookNameInput";
 import BookButton from "./BookButton";
 import api from "../server/Auth";
+import BookSelect from "./BookSelect";
 import { useDispatch } from "react-redux";
 import { BookActions } from "../../store/Book-slice";
 
@@ -28,15 +29,18 @@ const BookForm = () => {
     const submitForm = (event) => {
         event.preventDefault();
         const { target } = event;
+        const { type } = target;
         const { id } = target;
         const { content } = target;
-        SubmitServer(id.value, content.value)
+        console.log(type.value, id.value, content.value)
+        SubmitServer(type.value, id.value, content.value)
         receiveServer()
     }
 
-    const SubmitServer = async (id, content) => {//서버에 데이터를 제출하는코드
+    const SubmitServer = async (type, id, content) => {//서버에 데이터를 제출하는코드
         await api.post(`about/comments/upload`, {
             writername: id,
+            docType: type,
             body: content
         }).catch(err => {
             console.log(err)
@@ -53,21 +57,13 @@ const BookForm = () => {
         })
     }
 
-    const deletData = async () => {//삭제기능 코드
-        await api.delete("about/comments/clear", {
-
-        }).catch(err => {
-            console.log(err)
-        })
-    }
-
     return (
         <StyledBookForm onSubmit={submitForm}>
             <BookNameInput />
             <div>
                 <BookContentInput />
+                <BookSelect />
                 <BookButton />
-                <button onClick={deletData}>삭제</button>
             </div>
         </StyledBookForm>
     )

deblog/src/component/guestbook/BookSelect.js

@@ -0,0 +1,19 @@
+import styled from "styled-components";
+
+const StyledBookSelect = styled.select`
+
+
+`
+
+const BookSelect = () => {
+
+    return (
+        <StyledBookSelect name="type">
+            <option>피드백</option>
+            <option>질문</option>
+            <option>방명록</option>
+        </StyledBookSelect>
+    )
+}
+
+export default BookSelect