[10]SocialGallery Project

게시글 수정

1) 전체적인 폼은 업로드 폼과 동일
2) post를 put으로 변경

    const putSubmit = (pid) => {
        
        const headers = {
            'Content-type': 'multipart/form-data',
            'Authorization': "Bearer " + localStorage.getItem("token")
        }
        const formData = new FormData()
        formData.append('files', imgs)
        formData.append('usersId', localStorage.getItem('uid'))
        formData.append('title', title)
        formData.append('content', content)
        formData.append('category', updateCategory)

        axios.defaults.headers.post = null
        axios.put(`http://localhost:8080/api/post/modify/${pid}`,formData, {headers})
            .then(()=>{
                
            })
    }

---

게시글 삭제

1) axios delete

    const headers = {
        'Content-type': 'application/json',
        'Authorization': "Bearer " + localStorage.getItem("token")
    }

    function onHandelDelete(pid){
        axios.delete(`http://localhost:8080/api/post/delete/${pid}`, {headers})
            .then(res=>{
                window.location.reload()
            })
    }

2) delete form

<span className="material-icons outlined" onClick={()=>
  {onHandelDelete(mainImg[i].pid)}}>
delete
</span>

---

게시글 검색

0) redux store

## store.jsx
let mainImg  = createSlice({
  name : 'mainImg',
  initialState : {mainList:[]},
  reducers:{
      setMainImg:(state,action)=>{
          state.mainList = action.payload
      }
  },

})
export const {setMainImg} = mainImg.actions;

export default configureStore({
    reducer: {
        mainImg : mainImg.reducer,
    },
  })

1) URLSearchParams 사용

    const base_URL = "http://localhost:8080"
    const params = new URLSearchParams(window.location.search);

    let category = params.get("category")

            const search1 = (e) => {
                axios.get(base_URL + '/api/post?keyword=' + searchTitle)
                    .then(res => {
                        dispatch(setMainImg([...res.data.list]))
                        console.log()
                    })
                return search1
            }

2) 결과