{"id":6218,"date":"2022-05-27T16:35:02","date_gmt":"2022-05-27T08:35:02","guid":{"rendered":"https:\/\/www.lilichao.com\/?p=6218"},"modified":"2022-05-28T17:21:25","modified_gmt":"2022-05-28T09:21:25","slug":"rtk-query","status":"publish","type":"post","link":"https:\/\/lilichao.com\/?p=6218","title":{"rendered":"RTK Query"},"content":{"rendered":"\n

RTK\u4e0d\u4ec5\u5e2e\u52a9\u6211\u4eec\u89e3\u51b3\u4e86state\u7684\u95ee\u9898\uff0c\u540c\u65f6\uff0c\u5b83\u8fd8\u4e3a\u6211\u4eec\u63d0\u4f9b\u4e86RTK Query\u7528\u6765\u5e2e\u52a9\u6211\u4eec\u5904\u7406\u6570\u636e\u52a0\u8f7d\u7684\u95ee\u9898\u3002RTK Query\u662f\u4e00\u4e2a\u5f3a\u5927\u7684\u6570\u636e\u83b7\u53d6\u548c\u7f13\u5b58\u5de5\u5177\u3002\u5728\u5b83\u7684\u5e2e\u52a9\u4e0b\uff0cWeb\u5e94\u7528\u4e2d\u7684\u52a0\u8f7d\u53d8\u5f97\u5341\u5206\u7b80\u5355\uff0c\u5b83\u4f7f\u6211\u4eec\u4e0d\u518d\u9700\u8981\u81ea\u5df1\u7f16\u5199\u83b7\u53d6\u6570\u636e\u548c\u7f13\u5b58\u6570\u636e\u7684\u903b\u8f91\u3002<\/p>\n\n\n\n

Web\u5e94\u7528\u4e2d\u52a0\u8f7d\u6570\u636e\u65f6\u9700\u8981\u5904\u7406\u7684\u95ee\u9898\uff1a<\/p>\n\n\n\n

  1. \u6839\u636e\u4e0d\u540c\u7684\u52a0\u8f7d\u72b6\u6001\u663e\u793a\u4e0d\u540cUI\u7ec4\u4ef6<\/li>
  2. \u51cf\u5c11\u5bf9\u76f8\u540c\u6570\u636e\u91cd\u590d\u53d1\u9001\u8bf7\u6c42<\/li>
  3. \u4f7f\u7528\u4e50\u89c2\u66f4\u65b0\uff0c\u63d0\u5347\u7528\u6237\u4f53\u9a8c<\/li>
  4. \u5728\u7528\u6237\u4e0eUI\u4ea4\u4e92\u65f6\uff0c\u7ba1\u7406\u7f13\u5b58\u7684\u751f\u547d\u5468\u671f<\/li><\/ol>\n\n\n\n

    \u8fd9\u4e9b\u95ee\u9898\uff0cRTKQ\u90fd\u53ef\u4ee5\u5e2e\u52a9\u6211\u4eec\u5904\u7406\u3002\u9996\u5148\uff0c\u53ef\u4ee5\u76f4\u63a5\u901a\u8fc7RTKQ\u5411\u670d\u52a1\u5668\u53d1\u9001\u8bf7\u6c42\u52a0\u8f7d\u6570\u636e\uff0c\u5e76\u4e14RTKQ\u4f1a\u81ea\u52a8\u5bf9\u6570\u636e\u8fdb\u884c\u7f13\u5b58\uff0c\u907f\u514d\u91cd\u590d\u53d1\u9001\u4e0d\u5fc5\u8981\u7684\u8bf7\u6c42\u3002\u5176\u6b21\uff0cRTKQ\u5728\u53d1\u9001\u8bf7\u6c42\u65f6\u4f1a\u6839\u636e\u8bf7\u6c42\u4e0d\u540c\u7684\u72b6\u6001\u8fd4\u56de\u4e0d\u540c\u7684\u503c\uff0c\u6211\u4eec\u53ef\u4ee5\u901a\u8fc7\u8fd9\u4e9b\u503c\u6765\u76d1\u89c6\u8bf7\u6c42\u53d1\u9001\u7684\u8fc7\u7a0b\u5e76\u968f\u65f6\u4e2d\u6b62\u3002<\/p>\n\n\n\n

    \u4f7f\u7528<\/h2>\n\n\n\n

    RTKQ\u5df2\u7ecf\u96c6\u6210\u5728\u4e86RTK\u4e2d\uff0c\u5982\u679c\u6211\u4eec\u5df2\u7ecf\u5728\u9879\u76ee\u4e2d\u5f15\u5165\u4e86RTK\u5219\u65e0\u9700\u518d\u5f15\u5165\u5176\u4f59\u7684\u6a21\u5757\u3002\u5982\u679c\u4f60\u4e0d\u60f3\u4f7f\u7528RTKQ\u7ed9\u6211\u4eec\u63d0\u4f9b\u7684\u53d1\u9001\u8bf7\u6c42\u7684\u65b9\u5f0f\uff08\u7b80\u5355\u5c01\u88c5\u8fc7\u7684fetch\uff09\uff0c\u4f60\u8fd8\u9700\u8981\u5f15\u5165\u4e00\u4e0b\u4f60\u8981\u4f7f\u7528\u7684\u53d1\u9001\u8bf7\u6c42\u7684\u5de5\u5177\u3002<\/p>\n\n\n\n

    \u521b\u5efaApi\u5207\u7247<\/h3>\n\n\n\n

    RTKQ\u4e2d\u5c06\u4e00\u7ec4\u76f8\u5173\u529f\u80fd\u7edf\u4e00\u5c01\u88c5\u5230\u4e00\u4e2aApi\u5bf9\u8c61\u4e2d\uff0c\u6bd4\u5982\uff1a\u90fd\u662f\u5b66\u751f\u76f8\u5173\u64cd\u4f5c\u7edf\u4e00\u5c01\u88c5\u5230StudentApi\u4e2d\uff0c\u5173\u4e8e\u73ed\u7ea7\u7684\u76f8\u5173\u64cd\u4f5c\u5c01\u88c5\u5230ClassApi\u4e2d\u3002\u63a5\u4e0b\u6765\uff0c\u6211\u4eec\u5c1d\u8bd5\u521b\u5efa\u4e00\u4e2a\u7b80\u5355\u7684Api\uff0c\u81f3\u4e8e\u6570\u636e\u8fd8\u662f\u6211\u4eec\u4e4b\u524d\u6240\u719f\u6089\u7684\u5b66\u751f\u6570\u636e\uff1a<\/p>\n\n\n\n

    studentApi.js<\/p>\n\n\n\n

    import {createApi, fetchBaseQuery<\/em>} from \"@reduxjs\/toolkit\/dist\/query\/react\";

    export const studentApi = createApi({
        reducerPath:'studentApi',
        baseQuery:fetchBaseQuery<\/em>({
            baseUrl:'http:\/\/localhost:1337\/api\/'
        }),
        endpoints(build) {
            return {
                getStudents: build.query({
                    query() {
                        return 'students'
                    }
                }),
            }
        }
    });

    export const {useGetStudentsQuery} = studentApi;<\/pre>\n\n\n\n
    \u4e0a\u4f8b\u662f\u4e00\u4e2a\u6bd4\u8f83\u7b80\u5355\u7684Api\u5bf9\u8c61\u7684\u4f8b\u5b50\uff0c\u6211\u4eec\u6765\u5206\u6790\u4e00\u4e0b\uff0c\u9996\u5148\u6211\u4eec\u9700\u8981\u8c03\u7528createApi()<\/code>\u6765\u521b\u5efaApi\u5bf9\u8c61\u3002\u8fd9\u4e2a\u65b9\u6cd5\u5728RTK\u4e2d\u5b58\u5728\u4e24\u4e2a\u7248\u672c\uff0c\u4e00\u4e2a\u4f4d\u4e8e@reduxjs\/toolkit\/dist\/query<\/code>\u4e0b\uff0c\u4e00\u4e2a\u4f4d\u4e8e@reduxjs\/toolkit\/dist\/query\/react<\/code>\u4e0b\u3002react\u76ee\u5f55\u4e0b\u7684\u7248\u672c\u4f1a\u81ea\u52a8\u751f\u6210\u4e00\u4e2a\u94a9\u5b50\uff0c\u65b9\u4fbf\u6211\u4eec\u4f7f\u7528Api\u3002\u5982\u679c\u4e0d\u8981\u94a9\u5b50\uff0c\u53ef\u4ee5\u5f15\u5165query\u4e0b\u7684\u7248\u672c\uff0c\u5f53\u7136\u6211\u4e0d\u5efa\u8bae\u4f60\u8fd9\u4e48\u505a\u3002<\/p>\n\n\n\n
    createApi()<\/code>\u9700\u8981\u4e00\u4e2a\u914d\u7f6e\u5bf9\u8c61\u4f5c\u4e3a\u53c2\u6570\uff0c\u914d\u7f6e\u5bf9\u8c61\u4e2d\u7684\u5c5e\u6027\u7e41\u591a\uff0c\u6211\u4eec\u6682\u65f6\u4ecb\u7ecd\u6848\u4f8b\u4e2d\u7528\u5230\u7684\u5c5e\u6027\uff1a<\/p>\n\n\n\n
    reducerPath<\/p>\n\n\n\n
    \u7528\u6765\u8bbe\u7f6ereducer\u7684\u552f\u4e00\u6807\u8bc6\uff0c\u4e3b\u8981\u7528\u6765\u5728\u521b\u5efastore\u65f6\u6307\u5b9aaction\u7684type\u5c5e\u6027\uff0c\u5982\u679c\u4e0d\u6307\u5b9a\u9ed8\u8ba4\u4e3aapi\u3002<\/p>\n\n\n\n
    baseQuery<\/p>\n\n\n\n
    \u7528\u6765\u8bbe\u7f6e\u53d1\u9001\u8bf7\u6c42\u7684\u5de5\u5177\uff0c\u5c31\u662f\u4f60\u662f\u7528\u4ec0\u4e48\u53d1\u8bf7\u6c42\uff0cRTKQ\u4e3a\u6211\u4eec\u63d0\u4f9b\u4e86fetchBaseQuery\u4f5c\u4e3a\u67e5\u8be2\u5de5\u5177\uff0c\u5b83\u5bf9fetch\u8fdb\u884c\u4e86\u7b80\u5355\u7684\u5c01\u88c5\uff0c\u5f88\u65b9\u4fbf\uff0c\u5982\u679c\u4f60\u4e0d\u559c\u6b22\u53ef\u4ee5\u6539\u7528\u5176\u4ed6\u5de5\u5177\uff0c\u8fd9\u91cc\u6682\u65f6\u4e0d\u505a\u8ba8\u8bba\u3002<\/p>\n\n\n\n
    fetchBaseQuery<\/p>\n\n\n\n
    \u7b80\u5355\u5c01\u88c5\u8fc7\u7684fetch\u8c03\u7528\u540e\u4f1a\u8fd4\u56de\u4e00\u4e2a\u5c01\u88c5\u540e\u7684\u5de5\u5177\u51fd\u6570\u3002\u9700\u8981\u4e00\u4e2a\u914d\u7f6e\u5bf9\u8c61\u4f5c\u4e3a\u53c2\u6570\uff0cbaseUrl\u8868\u793aApi\u8bf7\u6c42\u7684\u57fa\u672c\u8def\u5f84\uff0c\u6307\u5b9a\u540e\u8bf7\u6c42\u5c06\u4f1a\u4ee5\u8be5\u8def\u5f84\u4e3a\u57fa\u672c\u8def\u5f84\u3002\u914d\u7f6e\u5bf9\u8c61\u4e2d\u5176\u4ed6\u5c5e\u6027\u6682\u4e0d\u8ba8\u8bba\u3002<\/p>\n\n\n\n
    endpoints<\/p>\n\n\n\n
    Api\u5bf9\u8c61\u5c01\u88c5\u4e86\u4e00\u7c7b\u529f\u80fd\uff0c\u6bd4\u5982\u5b66\u751f\u7684\u589e\u5220\u6539\u67e5\uff0c\u6211\u4eec\u4f1a\u7edf\u4e00\u5c01\u88c5\u5230\u4e00\u4e2a\u5bf9\u8c61\u4e2d\u3002\u4e00\u7c7b\u529f\u80fd\u4e2d\u7684\u6bcf\u4e00\u4e2a\u5177\u4f53\u529f\u80fd\u6211\u4eec\u53ef\u4ee5\u79f0\u5b83\u662f\u4e00\u4e2a\u7aef\u70b9\u3002endpoints\u7528\u6765\u5bf9\u8bf7\u6c42\u4e2d\u7684\u7aef\u70b9\u8fdb\u884c\u914d\u7f6e\u3002<\/p>\n\n\n\n
    endpoints\u662f\u4e00\u4e2a\u56de\u8c03\u51fd\u6570\uff0c\u53ef\u4ee5\u7528\u666e\u901a\u65b9\u6cd5\u7684\u5f62\u5f0f\u6307\u5b9a\uff0c\u4e5f\u53ef\u4ee5\u7528\u7bad\u5934\u51fd\u6570\u3002\u56de\u8c03\u51fd\u6570\u4e2d\u4f1a\u6536\u5230\u4e00\u4e2abuild\u5bf9\u8c61\uff0c\u4f7f\u7528build\u5bf9\u8c61\u5bf9\u70b9\u8fdb\u884c\u6620\u5c04\u3002\u56de\u8c03\u51fd\u6570\u7684\u8fd4\u56de\u503c\u662f\u4e00\u4e2a\u5bf9\u8c61\uff0cApi\u5bf9\u8c61\u4e2d\u7684\u6240\u6709\u7aef\u70b9\u90fd\u8981\u5728\u8be5\u5bf9\u8c61\u4e2d\u8fdb\u884c\u914d\u7f6e\u3002<\/p>\n\n\n\n
    \u5bf9\u8c61\u4e2d\u5c5e\u6027\u540d\u5c31\u662f\u8981\u5b9e\u73b0\u7684\u529f\u80fd\u540d\uff0c\u6bd4\u5982\u83b7\u53d6\u6240\u6709\u5b66\u751f\u53ef\u4ee5\u547d\u540d\u4e3agetStudents\uff0c\u6839\u636eid\u83b7\u53d6\u5b66\u751f\u53ef\u4ee5\u547d\u540d\u4e3agetStudentById\u3002\u5c5e\u6027\u503c\u8981\u901a\u8fc7build\u5bf9\u8c61\u521b\u5efa\uff0c\u5206\u4e24\u79cd\u60c5\u51b5\uff1a<\/p>\n\n\n\n
    \u67e5\u8be2\uff1abuild.query({})<\/code><\/p>\n\n\n\n
    \u589e\u5220\u6539\uff1abuild.mutation({})<\/code><\/p>\n\n\n\n
    \u4f8b\u5982\uff1a<\/p>\n\n\n\n
    getStudents: build.query({\n    query() {\n        return 'students'\n    }\n}),<\/code><\/pre>\n\n\n\n
    \u5148\u8bf4query\uff0cquery\u4e5f\u9700\u8981\u4e00\u4e2a\u914d\u7f6e\u5bf9\u8c61\u4f5c\u4e3a\u53c2\u6570\uff08\u53c8\u4ed6\u55b5\u7684\u662f\u914d\u7f6e\u5bf9\u8c61\uff09\u3002\u914d\u7f6e\u5bf9\u8c61\u91cc\u540c\u6837\u6709n\u591a\u4e2a\u5c5e\u6027\uff0c\u73b0\u5728\u76f4\u8bf4\u4e00\u4e2a\uff0cquery\u65b9\u6cd5\u3002\u6ce8\u610f\u4e0d\u8981\u641e\u6df7\u4e24\u4e2aquery\uff0c\u4e00\u4e2a\u662fbuild\u7684query\u65b9\u6cd5\uff0c\u4e00\u4e2a\u662fquery\u65b9\u6cd5\u914d\u7f6e\u5bf9\u8c61\u4e2d\u7684\u5c5e\u6027\uff0c\u8fd9\u4e2a\u65b9\u6cd5\u9700\u8981\u8fd4\u56de\u4e00\u4e2a\u5b50\u8def\u5f84\uff0c\u8fd9\u4e2a\u5b50\u8def\u5f84\u5c06\u4f1a\u548cbaseUrl\u62fc\u63a5\u4e3a\u4e00\u4e2a\u5b8c\u6574\u7684\u8bf7\u6c42\u8def\u5f84\u3002\u6bd4\u5982\uff1agetStudets\u7684\u6700\u7ec8\u8bf7\u6c42\u5730\u5740\u662f:<\/p>\n\n\n\n
    http:\/\/localhost:1337\/api\/<\/code>+students<\/code>=http:\/\/localhost:1337\/api\/students<\/code><\/p>\n\n\n\n
    \u53ef\u7b97\u662f\u4ecb\u7ecd\u5b8c\u4e86\uff0c\u4f46\u662f\u6ce8\u610f\u4e86\u8fd9\u4e2a\u53ea\u662f\u6700\u57fa\u672c\u7684\u914d\u7f6e\u3002RTKQ\u529f\u80fd\u975e\u5e38\u5f3a\u5927\uff0c\u4f46\u662f\u914d\u7f6e\u4e5f\u6bd4\u8f83\u9ebb\u70e6\u3002\u4e0d\u8fc7\uff0c\u719f\u4e86\u5c31\u597d\u4e86\u3002<\/p>\n\n\n\n
    \u4e0a\u4f8b\u4e2d\uff0c\u6211\u4eec\u521b\u5efa\u4e00\u4e2aApi\u5bf9\u8c61studentApi\uff0c\u5e76\u4e14\u5728\u5bf9\u8c61\u4e2d\u5b9a\u4e49\u4e86\u4e00\u4e2agetStudents\u65b9\u6cd5\u7528\u6765\u67e5\u8be2\u6240\u6709\u7684\u5b66\u751f\u4fe1\u606f\u3002\u5982\u679c\u6211\u4eec\u4f7f\u7528react\u4e0b\u7684createApi\uff0c\u5219\u5176\u521b\u5efa\u7684Api\u5bf9\u8c61\u4e2d\u4f1a\u81ea\u52a8\u751f\u6210\u94a9\u5b50\u51fd\u6570\uff0c\u94a9\u5b50\u51fd\u6570\u540d\u5b57\u4e3auseXxxQuery\u6216useXxxMutation\uff0c\u4e2d\u95f4\u7684Xxx\u5c31\u662f\u65b9\u6cd5\u540d\uff0c\u67e5\u8be2\u65b9\u6cd5\u7684\u540e\u7f00\u4e3aQuery\uff0c\u4fee\u6539\u65b9\u6cd5\u7684\u540e\u7f00\u4e3aMutation\u3002\u6240\u4ee5\u4e0a\u4f8b\u4e2d\uff0cApi\u5bf9\u8c61\u4e2d\u4f1a\u81ea\u52a8\u751f\u6210\u4e00\u4e2a\u540d\u4e3auseGetStudentsQuery\u7684\u94a9\u5b50\uff0c\u6211\u4eec\u53ef\u4ee5\u83b7\u53d6\u5e76\u5c06\u94a9\u5b50\u5411\u5916\u90e8\u66b4\u9732\u3002<\/p>\n\n\n\n
    export const {useGetStudentsQuery} = studentApi;<\/code><\/pre>\n\n\n\n
    \u521b\u5efastore\u5bf9\u8c61<\/h3>\n\n\n\n
    Api\u5bf9\u8c61\u7684\u4f7f\u7528\u6709\u4e24\u79cd\u65b9\u5f0f\uff0c\u4e00\u79cd\u662f\u76f4\u63a5\u4f7f\u7528\uff0c\u4e00\u79cd\u662f\u4f5c\u4e3astore\u4e2d\u7684\u4e00\u4e2areducer\u4f7f\u7528\u3002store\u662f\u6211\u4eec\u6bd4\u8f83\u719f\u6089\u7684\uff0c\u6240\u4ee5\u5148\u4ecestore\u5165\u624b\u3002<\/p>\n\n\n\n
    import {configureStore<\/em>} from \"@reduxjs\/toolkit\";\nimport {studentApi} from \".\/studentApi\";\n\nexport const store = configureStore<\/em>({\n    reducer:{\n        [studentApi.reducerPath]:studentApi.reducer\n    },\n    middleware:getDefaultMiddleware =>\n        getDefaultMiddleware().concat(studentApi.middleware),\n});<\/pre>\n\n\n\n
    \u521b\u5efastore\u5e76\u6ca1\u6709\u4ec0\u4e48\u7279\u522b\uff0c\u53ea\u662f\u6ce8\u610f\u9700\u8981\u6dfb\u52a0\u4e00\u4e2a\u4e2d\u95f4\u4ef6\uff0c\u8fd9\u4e2a\u4e2d\u95f4\u4ef6\u5df2\u81ea\u52a8\u751f\u6210\u4e86\u6211\u4eec\u76f4\u63a5\u5f15\u5165\u5373\u53ef\uff0c\u4e2d\u95f4\u4ef6\u7528\u6765\u5904\u7406Api\u7684\u7f13\u5b58\u3002<\/p>\n\n\n\n
    store\u521b\u5efa\u5b8c\u6bd5\u540c\u6837\u8981\u8bbe\u7f6eProvider\u6807\u7b7e\uff0c\u8fd9\u91cc\u4e0d\u518d\u5c55\u793a\u3002\u63a5\u4e0b\u6765\uff0c\u6211\u4eec\u6765\u770b\u770b\u5982\u679c\u901a\u8fc7studentApi\u53d1\u9001\u8bf7\u6c42\u3002\u7531\u4e8e\u6211\u4eec\u5df2\u7ecf\u5c06studentApi\u4e2d\u7684\u94a9\u5b50\u51fd\u6570\u5411\u5916\u90e8\u5bfc\u51fa\u4e86\uff0c\u6240\u4ee5\u6211\u4eec\u53ea\u9700\u901a\u8fc7\u94a9\u5b50\u51fd\u6570\u5373\u53ef\u81ea\u52a8\u52a0\u8f7d\u5230\u6240\u6709\u7684\u5b66\u751f\u4fe1\u606f\u3002\u6bd4\u5982\uff0c\u73b0\u5728\u5728App.js\u4e2d\u52a0\u8f7d\u4fe1\u606f\u53ef\u4ee5\u8fd9\u6837\u7f16\u5199\u4ee3\u7801\uff1a<\/p>\n\n\n\n
    import React from 'react';\nimport {useGetStudentsQuery} from '.\/store\/studentApi';\n\nconst App = () => {\n    const {data, isFetching, isSuccess} = useGetStudentsQuery();\n\n    return (\n        <div>\n            {isFetching && <p>\u6570\u636e\u6b63\u5728\u52a0\u8f7d...<\/p>}\n            {isSuccess && data.data.map(item => <p key={item.id}>\n                {item.attributes.name} --\n                {item.attributes.age} --\n                {item.attributes.gender} --\n                {item.attributes.address}\n            <\/p>)}\n        <\/div>\n    );\n};\n\nexport default App;\n<\/pre>\n\n\n\n
    \u76f4\u63a5\u8c03\u7528useGetStudentsQuery()\u5b83\u4f1a\u81ea\u52a8\u5411\u670d\u52a1\u5668\u53d1\u9001\u8bf7\u6c42\u52a0\u8f7d\u6570\u636e\uff0c\u5e76\u8fd4\u56de\u4e00\u4e2a\u5bf9\u8c61\u3002\u8fd9\u4e2a\u5bf9\u8c61\u4e2d\u5305\u62ec\u4e86\u5f88\u591a\u5c5e\u6027\uff1a<\/p>\n\n\n\n
    1. data – \u6700\u65b0\u8fd4\u56de\u7684\u6570\u636e<\/li>
    2. currentData – \u5f53\u524d\u7684\u6570\u636e<\/li>
    3. error – \u9519\u8bef\u4fe1\u606f<\/li>
    4. isUninitialized – \u5982\u679c\u4e3atrue\u5219\u8868\u793a\u67e5\u8be2\u8fd8\u6ca1\u5f00\u59cb<\/li>
    5. isLoading – \u4e3atrue\u65f6\uff0c\u8868\u793a\u8bf7\u6c42\u6b63\u5728\u7b2c\u4e00\u6b21\u52a0\u8f7d<\/li>
    6. isFetching \u4e3atrue\u65f6\uff0c\u8868\u793a\u8bf7\u6c42\u6b63\u5728\u52a0\u8f7d<\/li>
    7. isSuccess \u4e3atrue\u65f6\uff0c\u8868\u793a\u8bf7\u6c42\u53d1\u9001\u6210\u529f<\/li>
    8. isError \u4e3atrue\u65f6\uff0c\u8868\u793a\u8bf7\u6c42\u6709\u9519\u8bef<\/li>
    9. refetch \u51fd\u6570\uff0c\u7528\u6765\u91cd\u65b0\u52a0\u8f7d\u6570\u636e<\/li><\/ol>\n\n\n\n
      \u4f7f\u7528\u4e2d\u53ef\u4ee5\u6839\u636e\u9700\u8981\uff0c\u9009\u62e9\u8981\u83b7\u53d6\u5230\u7684\u5c5e\u6027\u503c\u3002\u5199\u4e86\u8fd9\u4e48\u591a\uff0c\u4e5f\u53ea\u5199\u4e86\u4e00\u4e2aHello World\u3002\u4f46\u662f\uff0c\u826f\u597d\u7684\u5f00\u7aef\u662f\u6210\u529f\u7684\u4e00\u534a\uff0c\u8fd9\u4e2a\u7406\u89e3\u4e86\uff0c\u540e\u8fb9\u7684\u4e1c\u897f\u4e5f\u5c31\u7b80\u5355\u4e86\uff01<\/p>\n","protected":false},"excerpt":{"rendered":"
      RTK\u4e0d\u4ec5\u5e2e\u52a9\u6211\u4eec\u89e3\u51b3\u4e86state\u7684\u95ee\u9898\uff0c\u540c\u65f6\uff0c\u5b83\u8fd8\u4e3a\u6211\u4eec\u63d0\u4f9b\u4e86RTK Query\u7528\u6765\u5e2e\u52a9\u6211\u4eec\u5904\u7406\u6570\u636e\u52a0\u8f7d\u7684\u95ee […]<\/p>\n","protected":false},"author":1,"featured_media":6205,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[198],"tags":[202,263,264],"_links":{"self":[{"href":"https:\/\/lilichao.com\/index.php?rest_route=\/wp\/v2\/posts\/6218"}],"collection":[{"href":"https:\/\/lilichao.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/lilichao.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/lilichao.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lilichao.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=6218"}],"version-history":[{"count":8,"href":"https:\/\/lilichao.com\/index.php?rest_route=\/wp\/v2\/posts\/6218\/revisions"}],"predecessor-version":[{"id":6226,"href":"https:\/\/lilichao.com\/index.php?rest_route=\/wp\/v2\/posts\/6218\/revisions\/6226"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/lilichao.com\/index.php?rest_route=\/wp\/v2\/media\/6205"}],"wp:attachment":[{"href":"https:\/\/lilichao.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=6218"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/lilichao.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=6218"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/lilichao.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=6218"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}