๋ณธ๋ฌธ ๋ฐ”๋กœ๊ฐ€๊ธฐ
728x90
๋ฐ˜์‘ํ˜•

RTK-Query2

[React Native] RTK-Query ํŒŒ๋ผ๋ฏธํ„ฐ์— ๋งž๊ฒŒ ํŠน์ • ๋ฐ์ดํ„ฐ๋งŒ ๋ถˆ๋Ÿฌ์˜ค๊ธฐ(Get specific data by parameter using RTK-query) ์•ˆ๋…•ํ•˜์„ธ์š” Foma ์ž…๋‹ˆ๋‹ค. ์˜ค๋Š˜์€ RTK-Query์—์„œ ํŒŒ๋ผ๋ฏธํ„ฐ์— ๋งž๊ฒŒ ์›ํ•˜๋Š” ํŠน์ • ๋ฐ์ดํ„ฐ๋ฅผ ๋ถˆ๋Ÿฌ์˜ค๋Š” ๋ฐฉ๋ฒ•์— ๋Œ€ํ•ด ์•Œ์•„๋ณด๋ ค๊ณ  ํ•ฉ๋‹ˆ๋‹ค. ๋งŽ์€ ์‚ฝ์งˆ์„ ํ•˜๊ณ  ๊ฒฐ๊ตญ ํ•ด๊ฒฐ๋ฒ•์„ ์•Œ์•„๋‚ด๊ฒŒ ๋˜์–ด ๊ธ€๋กœ ์ •๋ฆฌํ•˜๋ ค๊ณ  ํ•ฉ๋‹ˆ๋‹ค. ๋ฐ”๋กœ ์‹œ์ž‘ํ• ๊ฒŒ์š”~ 1. ์ฒซ ๋ฒˆ์งธ ์‹œ๋„ ์šฐ์„  ์ œ๊ฐ€ ํ•˜๋ ค ํ–ˆ๋˜๊ฑด ์œ ์ €๋ฅผ ์ด๋ฆ„์œผ๋กœ ์กฐํšŒํ•ด์„œ ๋ฐ์ดํ„ฐ๋ฅผ ๊ฐ€์ ธ์˜ค๋Š” ๊ฒƒ์ด์—ˆ๋Š”๋ฐ์š”. ์•„๋ž˜์™€ ๊ฐ™์ด ์ฟผ๋ฆฌ๋ฅผ ํ†ตํ•ด์„œ ์—”๋“œํฌ์ธํŠธ๋ฅผ ๋งŒ๋“ค์—ˆ์Šต๋‹ˆ๋‹ค. export const userAPISlice = createApi({ reducerPath: 'userAPI', baseQuery: fetchBaseQuery({baseUrl: 'http://192.168.111.34:3001/api'}), endpoints: builder => ({ ... getUserByName: builde.. 2022. 8. 12.
[React Native] RTK-Query๋กœ ์„œ๋ฒ„์™€ ํ†ต์‹ ํ•˜๊ธฐ (feat. Typescript) Install redux-toolkit npm install @reduxjs/toolkit TodoModel interface TodoModel { id: number; title: string; content: string; } Create API Slice createApi์™€ fetchBaseQuery๋ฅผ import ํ•ด์ค๋‹ˆ๋‹ค. import {createApi, fetchBaseQuery} from '@reduxjs/toolkit/query/react'; ์ €๋Š” TodoList๋ฅผ ๊ธฐ๋ฐ˜์œผ๋กœ ์•„๋ž˜์™€ ๊ฐ™์ด ๋งŒ๋“ค์–ด ์ฃผ๊ฒ ์Šต๋‹ˆ๋‹ค. reducerPath: ์Šคํ† ์–ด์˜ reducer๋กœ ์ง€์ •ํ•  Path์˜ ์ด๋ฆ„ baseQuery: ๊ธฐ๋ณธ์œผ๋กœ ์ง€์ •ํ•  ์„œ๋ฒ„ URL tagTypes: ์ž๋™์œผ๋กœ ๋ฐ์ดํ„ฐ๊ฐ€ ํŒจ์น˜๋˜๊ฒŒ ๊ตฌ๋ณ„ํ•  ํƒ€์ž… endpo.. 2022. 8. 6.
728x90
๋ฐ˜์‘ํ˜•

ํ‹ฐ์Šคํ† ๋ฆฌํˆด๋ฐ”