ksw_devlog

리액트 네이티브 -> 앱개발 !주의! : 웹: 텍스트 (Ok) 앱: 텍스트 (Not Ok) >> 텍스트 (Ok)

map() : 배열을 바꿔준다 data.map(x=>x.a) ex) [1,2,3,4].map(x => x+2) // [3, 4, 5, 6] Map 함수 map함수는 callbackFunction을 실행한 결과를 가지고 새로운 배열을 만들 때 사용한다. array.map(callbackFunction(currenValue, index, array), thisArg) filter, forEach와 같은 구문이다. callbackFunction, thisArg 두개의 매개변수가 있고 callbackFunction은 currentValue, index, array 3개의 매개변수를 갖는다. currentValue : 배열 내 현재 값 index : 배열 내 현재 값의 인덱스 array : 현재 배열 thisAr..

import React, { useState, useEffect } from 'react'; import './match.css'; import { FiChevronLeft } from "react-icons/fi"; import { useNavigate, useParams, useLocation } from 'react-router-dom'; import axios from 'axios'; const Match = () => { const { path } = useParams(); const location = useLocation(); let EPLId = location.state.EPLId; let LaligaId = location.state.LaligaId; let SerieAId = loca..

Match.jsx import React, { useState, useEffect } from "react"; import "./match.css"; import { useNavigate, useParams, useLocation } from "react-router-dom"; import axios from "axios"; const Match = () => { const { path } = useParams(); const location = useLocation(); let EPLId = location.state.EPLId; let LaligaId = location.state.LaligaId; let SerieAId = location.state.SerieAId; let EPLUId = loca..

- 메인페이지에서 해당 경기를 클릭했을 때 상세페이지로 넘어갈 때 서버에 저장된 내용(해당리그, 홈팀, 어웨이팀, 경기시간 경기장소 등..)을 바탕으로 경기정보를 불러오는 기능을 구현하기로 했다. - 메인페이지 가운데 부분에 경기들이 나열돼있다. 해당 경기를 클릭하면 상세페이지로 넘어가게 해야되는데 우선 router.js 페이지에서 Route path를 파라미터를 추가하여 만들었다 => 그리고 메인페이지 컴포넌트로 넘어와서 { navigate("/detail/EPL" + i + "", { state: { EPLId: "EPL", EPLUId: parseInt("100" + i) } }); }} > navigate에 state를 남겨서 디테일페이지로 넘겨준다.(EPL.jsx, Laliga.jsx, Seri..

map()이 뭐지? JavaScript의 표준 내장 객체이다. map() 메서드는 배열 내의 모든 요소 각각에 대하여 주어진 함수를 호출한 결과를 모아 새로운 배열을 반환한다. 참고 : MDN const arr = [1, 2, 3, 4, 5] 라는 배열이 있다. 배열 안에 있는 모든 요소를 제곱하여 새로운 배열을 만들고 싶다면 어떻게 해야 할까? 바로 map() 메서드를 사용하면 된다. const arr = [1, 2, 3, 4, 5]; const mapArr = arr.map(num => num * num); console.log(arr); // > Array [1, 2, 3, 4, 5] console.log(mapArr); // > Array [1, 4, 9, 16, 25] map() 메서드 안에 들..

해외축구 리그경기 승부예측 사이트를 만들기로 하였다 우선 Header, Footer 컴포넌트를 만드는 역할을 맡았다. 배트맨 로고를 누르면 메인페이지를 라우팅해주고 커뮤니티 부분을 누르면 커뮤니티 페이지를 라우팅해주도록 만들었다. import React from "react"; import { BrowserRouter, Route, Routes } from "react-router-dom"; import Header from "../redux/components/Header/Header"; import Footer from "../redux/components/Footer/Footer"; import "./router.css"; const Router = () => { return ( ); }; expo..

Redux store에 state 보관하는 법 저번시간에 만들어둔 store.js 파일 열어서 이렇게 코드짜면 state 하나 만들 수 있습니다. step 1. createSlice( ) 로 state 만들고 step 2. configureStore( ) 안에 등록하면 됩니다. import { configureStore, createSlice } from '@reduxjs/toolkit' let user = createSlice({ name : 'user', initialState : 'kim' }) export default configureStore({ reducer: { user : user.reducer } }) 1. createSlice( ) 상단에서 import 해온 다음에 { name : '..