{"id":64351,"date":"2026-01-23T11:48:34","date_gmt":"2026-01-23T03:48:34","guid":{"rendered":"https:\/\/www.wsisp.com\/helps\/64351.html"},"modified":"2026-01-23T11:48:34","modified_gmt":"2026-01-23T03:48:34","slug":"%e5%b0%8f%e7%99%bd%e5%9f%ba%e7%a1%80%e5%85%a5%e9%97%a8-react-native-%e9%b8%bf%e8%92%99%e8%b7%a8%e5%b9%b3%e5%8f%b0%e5%bc%80%e5%8f%91%ef%bc%9a%e6%97%a5%e6%9c%9f%e5%a4%a9%e6%95%b0%e8%ae%a1%e7%ae%97","status":"publish","type":"post","link":"https:\/\/www.wsisp.com\/helps\/64351.html","title":{"rendered":"\u5c0f\u767d\u57fa\u7840\u5165\u95e8 React Native \u9e3f\u8499\u8de8\u5e73\u53f0\u5f00\u53d1\uff1a\u65e5\u671f\u5929\u6570\u8ba1\u7b97\u5de5\u5177"},"content":{"rendered":"

\"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\"<\/p>\n

\u4e00\u3001\u6838\u5fc3\u77e5\u8bc6\u70b9：\u65e5\u671f\u8ba1\u7b97\u5de5\u5177\u5b8c\u6574\u6838\u5fc3\u7528\u6cd5<\/h3>\n

1. \u7528\u5230\u7684\u7eaf\u5185\u7f6e\u7ec4\u4ef6\u4e0eAPI<\/h4>\n

\u6240\u6709\u80fd\u529b\u5747\u4e3a RN \u539f\u751f\u81ea\u5e26，\u5168\u90e8\u4ece react-native \u6838\u5fc3\u5305\u76f4\u63a5\u5bfc\u5165，\u65e0\u4efb\u4f55\u5916\u90e8\u4f9d\u8d56\u3001\u65e0\u4efb\u4f55\u7b2c\u4e09\u65b9\u5e93，\u9e3f\u8499\u7aef\u65e0\u4efb\u4f55\u517c\u5bb9\u95ee\u9898，\u4e5f\u662f\u5b9e\u73b0\u65e5\u671f\u8ba1\u7b97\u7684\u5168\u90e8\u6838\u5fc3\u80fd\u529b，\u57fa\u7840\u6613\u7406\u89e3\u3001\u6613\u590d\u7528，\u65e0\u591a\u4f59，\u6240\u6709\u65e5\u671f\u8ba1\u7b97\u529f\u80fd\u5747\u57fa\u4e8e\u4ee5\u4e0b\u7ec4\u4ef6\/API \u539f\u751f\u5b9e\u73b0：<\/p>\n\n\u6838\u5fc3\u7ec4\u4ef6\/API\u4f5c\u7528\u8bf4\u660e\u9e3f\u8499\u9002\u914d\u7279\u6027<\/tr>\n\n\n\n\n\n\n
View<\/td>\n\u6838\u5fc3\u5bb9\u5668\u7ec4\u4ef6，\u5b9e\u73b0\u65e5\u671f\u8ba1\u7b97\u5e03\u5c40\u3001\u7ed3\u679c\u663e\u793a\u3001\u63a7\u5236\u6309\u94ae\u7b49<\/td>\n\u2705 \u9e3f\u8499\u7aef\u5e03\u5c40\u65e0\u62a5\u9519，\u5e03\u5c40\u7cbe\u786e\u3001\u5706\u89d2\u3001\u8fb9\u6846\u3001\u80cc\u666f\u8272\u5c5e\u6027\u5b8c\u7f8e\u751f\u6548<\/td>\n<\/tr>\n
Text<\/td>\n\u663e\u793a\u65e5\u671f\u3001\u8ba1\u7b97\u7ed3\u679c\u3001\u63d0\u793a\u4fe1\u606f\u7b49，\u652f\u6301\u591a\u884c\u6587\u672c\u3001\u4e0d\u540c\u989c\u8272\u72b6\u6001<\/td>\n\u2705 \u9e3f\u8499\u7aef\u6587\u5b57\u6392\u7248\u7cbe\u81f4，\u5b57\u53f7\u3001\u989c\u8272\u3001\u884c\u9ad8\u5747\u65e0\u9002\u914d\u5f02\u5e38<\/td>\n<\/tr>\n
TouchableOpacity<\/td>\n\u5b9e\u73b0\u65e5\u671f\u8ba1\u7b97\u4ea4\u4e92，\u652f\u6301\u9009\u62e9\u65e5\u671f\u3001\u6267\u884c\u8ba1\u7b97\u7b49\u64cd\u4f5c<\/td>\n\u2705 \u9e3f\u8499\u7aef\u89e6\u6478\u54cd\u5e94\u7075\u654f，\u70b9\u51fb\u53cd\u9988\u6d41\u7545，\u65e0\u517c\u5bb9\u95ee\u9898<\/td>\n<\/tr>\n
StyleSheet<\/td>\n\u539f\u751f\u6837\u5f0f\u7ba1\u7406，\u7f16\u5199\u9e3f\u8499\u7aef\u6700\u4f73\u7684\u65e5\u671f\u8ba1\u7b97\u6837\u5f0f：\u5bb9\u5668\u3001\u7ed3\u679c\u663e\u793a\u3001\u6309\u94ae\u7b49，\u65e0\u4efb\u4f55\u4e0d\u517c\u5bb9CSS\u5c5e\u6027<\/td>\n\u2705 \u7b26\u5408\u9e3f\u8499\u5b98\u65b9\u89c6\u89c9\u8bbe\u8ba1\u89c4\u8303，\u989c\u8272\u3001\u5706\u89d2\u3001\u8fb9\u6846\u3001\u95f4\u8ddd\u5747\u4e3a\u771f\u673a\u5b9e\u6d4b\u6700\u4f18<\/td>\n<\/tr>\n
useState \/ useEffect<\/td>\nReact \u539f\u751f\u94a9\u5b50，\u7ba1\u7406\u65e5\u671f\u72b6\u6001\u3001\u8ba1\u7b97\u7ed3\u679c\u3001\u8f93\u5165\u503c\u7b49\u6838\u5fc3\u6570\u636e，\u63a7\u5236\u5b9e\u65f6\u66f4\u65b0\u3001\u72b6\u6001\u5207\u6362<\/td>\n\u2705 \u54cd\u5e94\u5f0f\u66f4\u65b0\u65e0\u5ef6\u8fdf，\u72b6\u6001\u5207\u6362\u6d41\u7545\u65e0\u5361\u987f，\u8ba1\u7b97\u7ed3\u679c\u5b9e\u65f6\u663e\u793a<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n
\n

\u4e8c\u3001\u5b9e\u6218\u6838\u5fc3\u4ee3\u7801\u89e3\u6790<\/h3>\n

1. \u65e5\u671f\u52a0\u51cf\u8ba1\u7b97<\/h4>\n

\u5b9e\u73b0\u65e5\u671f\u7684\u52a0\u51cf\u8ba1\u7b97\u529f\u80fd\u3002<\/p>\n

import<\/span> {<\/span> useState }<\/span> from<\/span> 'react'<\/span>;<\/span>
\nimport<\/span> {<\/span> View,<\/span> Text,<\/span> TouchableOpacity,<\/span> StyleSheet,<\/span> TextInput }<\/span> from<\/span> 'react-native'<\/span>;<\/span><\/p>\n

const<\/span> DateCalculator<\/span> =<\/span> (<\/span>)<\/span> =><\/span> {<\/span>
\n const<\/span> [<\/span>baseDate,<\/span> setBaseDate]<\/span> =<\/span> useState<<\/span>string><\/span>(<\/span>new<\/span> Date<\/span>(<\/span>)<\/span>.<\/span>toISOString<\/span>(<\/span>)<\/span>.<\/span>split<\/span>(<\/span>'T'<\/span>)<\/span>[<\/span>0<\/span>]<\/span>)<\/span>;<\/span>
\n const<\/span> [<\/span>days,<\/span> setDays]<\/span> =<\/span> useState<<\/span>string><\/span>(<\/span>'7'<\/span>)<\/span>;<\/span>
\n const<\/span> [<\/span>result,<\/span> setResult]<\/span> =<\/span> useState<<\/span>string><\/span>(<\/span>''<\/span>)<\/span>;<\/span><\/p>\n

const<\/span> addDays<\/span> =<\/span> (<\/span>)<\/span> =><\/span> {<\/span>
\n const<\/span> date =<\/span> new<\/span> Date<\/span>(<\/span>baseDate)<\/span>;<\/span>
\n const<\/span> daysToAdd =<\/span> parseInt<\/span>(<\/span>days)<\/span> ||<\/span> 0<\/span>;<\/span>
\n date.<\/span>setDate<\/span>(<\/span>date.<\/span>getDate<\/span>(<\/span>)<\/span> +<\/span> daysToAdd)<\/span>;<\/span>
\n setResult<\/span>(<\/span>date.<\/span>toISOString<\/span>(<\/span>)<\/span>.<\/span>split<\/span>(<\/span>'T'<\/span>)<\/span>[<\/span>0<\/span>]<\/span>)<\/span>;<\/span>
\n }<\/span>;<\/span><\/p>\n

const<\/span> subtractDays<\/span> =<\/span> (<\/span>)<\/span> =><\/span> {<\/span>
\n const<\/span> date =<\/span> new<\/span> Date<\/span>(<\/span>baseDate)<\/span>;<\/span>
\n const<\/span> daysToSubtract =<\/span> parseInt<\/span>(<\/span>days)<\/span> ||<\/span> 0<\/span>;<\/span>
\n date.<\/span>setDate<\/span>(<\/span>date.<\/span>getDate<\/span>(<\/span>)<\/span> –<\/span> daysToSubtract)<\/span>;<\/span>
\n setResult<\/span>(<\/span>date.<\/span>toISOString<\/span>(<\/span>)<\/span>.<\/span>split<\/span>(<\/span>'T'<\/span>)<\/span>[<\/span>0<\/span>]<\/span>)<\/span>;<\/span>
\n }<\/span>;<\/span><\/p>\n

return<\/span> (<\/span>
\n <<\/span>View style=<\/span>{<\/span>styles.<\/span>container}<\/span>><\/span>
\n <<\/span>TextInput
\n style=<\/span>{<\/span>styles.<\/span>input}<\/span>
\n value=<\/span>{<\/span>baseDate}<\/span>
\n onChangeText=<\/span>{<\/span>setBaseDate}<\/span>
\n placeholder=<\/span>"\u57fa\u7840\u65e5\u671f (YYYY-MM-DD)"<\/span>
\n \/<\/span>><\/span>
\n <<\/span>TextInput
\n style=<\/span>{<\/span>styles.<\/span>input}<\/span>
\n value=<\/span>{<\/span>days}<\/span>
\n onChangeText=<\/span>{<\/span>setDays}<\/span>
\n keyboardType=<\/span>"number-pad"<\/span>
\n placeholder=<\/span>"\u5929\u6570"<\/span>
\n \/<\/span>><\/span>
\n <<\/span>View style=<\/span>{<\/span>styles.<\/span>buttonRow}<\/span>><\/span>
\n <<\/span>TouchableOpacity style=<\/span>{<\/span>styles.<\/span>button}<\/span> onPress=<\/span>{<\/span>addDays}<\/span>><\/span>
\n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>buttonText}<\/span>><\/span>\u52a0\u5929\u6570<<\/span>\/<\/span>Text><\/span>
\n <<\/span>\/<\/span>TouchableOpacity><\/span>
\n <<\/span>TouchableOpacity style=<\/span>{<\/span>styles.<\/span>button}<\/span> onPress=<\/span>{<\/span>subtractDays}<\/span>><\/span>
\n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>buttonText}<\/span>><\/span>\u51cf\u5929\u6570<<\/span>\/<\/span>Text><\/span>
\n <<\/span>\/<\/span>TouchableOpacity><\/span>
\n <<\/span>\/<\/span>View><\/span>
\n {<\/span>result &&<\/span> <<\/span>Text style=<\/span>{<\/span>styles.<\/span>resultText}<\/span>><\/span>\u7ed3\u679c:<\/span> {<\/span>result}<\/span><<\/span>\/<\/span>Text><\/span>}<\/span>
\n <<\/span>\/<\/span>View><\/span>
\n )<\/span>;<\/span>
\n}<\/span>;<\/span><\/p>\n

const<\/span> styles =<\/span> StyleSheet.<\/span>create<\/span>(<\/span>{<\/span>
\n container<\/span>:<\/span> {<\/span>
\n padding<\/span>:<\/span> 20<\/span>,<\/span>
\n }<\/span>,<\/span>
\n input<\/span>:<\/span> {<\/span>
\n borderWidth<\/span>:<\/span> 1<\/span>,<\/span>
\n borderColor<\/span>:<\/span> '#DCDFE6'<\/span>,<\/span>
\n borderRadius<\/span>:<\/span> 8<\/span>,<\/span>
\n padding<\/span>:<\/span> 12<\/span>,<\/span>
\n marginBottom<\/span>:<\/span> 12<\/span>,<\/span>
\n fontSize<\/span>:<\/span> 16<\/span>,<\/span>
\n }<\/span>,<\/span>
\n buttonRow<\/span>:<\/span> {<\/span>
\n flexDirection<\/span>:<\/span> 'row'<\/span>,<\/span>
\n gap<\/span>:<\/span> 12<\/span>,<\/span>
\n marginBottom<\/span>:<\/span> 12<\/span>,<\/span>
\n }<\/span>,<\/span>
\n button<\/span>:<\/span> {<\/span>
\n backgroundColor<\/span>:<\/span> '#409EFF'<\/span>,<\/span>
\n borderRadius<\/span>:<\/span> 8<\/span>,<\/span>
\n paddingVertical<\/span>:<\/span> 12<\/span>,<\/span>
\n paddingHorizontal<\/span>:<\/span> 20<\/span>,<\/span>
\n flex<\/span>:<\/span> 1<\/span>,<\/span>
\n alignItems<\/span>:<\/span> 'center'<\/span>,<\/span>
\n }<\/span>,<\/span>
\n buttonText<\/span>:<\/span> {<\/span>
\n color<\/span>:<\/span> '#FFFFFF'<\/span>,<\/span>
\n fontSize<\/span>:<\/span> 16<\/span>,<\/span>
\n fontWeight<\/span>:<\/span> '600'<\/span>,<\/span>
\n }<\/span>,<\/span>
\n resultText<\/span>:<\/span> {<\/span>
\n fontSize<\/span>:<\/span> 16<\/span>,<\/span>
\n color<\/span>:<\/span> '#303133'<\/span>,<\/span>
\n marginTop<\/span>:<\/span> 12<\/span>,<\/span>
\n }<\/span>,<\/span>
\n}<\/span>)<\/span>;<\/span><\/p>\n

export<\/span> default<\/span> DateCalculator;<\/span><\/p>\n

\u6838\u5fc3\u8981\u70b9：<\/p>\n

    \n
  • \u4f7f\u7528Date\u5bf9\u8c61\u8fdb\u884c\u65e5\u671f\u8ba1\u7b97<\/li>\n
  • \u652f\u6301\u65e5\u671f\u52a0\u51cf\u5929\u6570<\/li>\n
  • \u5904\u7406\u65e5\u671f\u683c\u5f0f\u8f6c\u6362<\/li>\n
  • \u9e3f\u8499\u7aef\u65e5\u671f\u8ba1\u7b97\u6b63\u5e38<\/li>\n<\/ul>\n

    2. \u65e5\u671f\u5dee\u503c\u8ba1\u7b97<\/h4>\n

    \u5b9e\u73b0\u4e24\u4e2a\u65e5\u671f\u4e4b\u95f4\u7684\u5dee\u503c\u8ba1\u7b97\u3002<\/p>\n

    import<\/span> {<\/span> useState }<\/span> from<\/span> 'react'<\/span>;<\/span>
    \nimport<\/span> {<\/span> View,<\/span> Text,<\/span> TouchableOpacity,<\/span> StyleSheet,<\/span> TextInput }<\/span> from<\/span> 'react-native'<\/span>;<\/span><\/p>\n

    const<\/span> DateDifference<\/span> =<\/span> (<\/span>)<\/span> =><\/span> {<\/span>
    \n const<\/span> [<\/span>startDate,<\/span> setStartDate]<\/span> =<\/span> useState<<\/span>string><\/span>(<\/span>new<\/span> Date<\/span>(<\/span>)<\/span>.<\/span>toISOString<\/span>(<\/span>)<\/span>.<\/span>split<\/span>(<\/span>'T'<\/span>)<\/span>[<\/span>0<\/span>]<\/span>)<\/span>;<\/span>
    \n const<\/span> [<\/span>endDate,<\/span> setEndDate]<\/span> =<\/span> useState<<\/span>string><\/span>(<\/span>new<\/span> Date<\/span>(<\/span>)<\/span>.<\/span>toISOString<\/span>(<\/span>)<\/span>.<\/span>split<\/span>(<\/span>'T'<\/span>)<\/span>[<\/span>0<\/span>]<\/span>)<\/span>;<\/span>
    \n const<\/span> [<\/span>difference,<\/span> setDifference]<\/span> =<\/span> useState<<\/span>{<\/span> days<\/span>:<\/span> number;<\/span> hours:<\/span> number;<\/span> minutes:<\/span> number }<\/span>><\/span>(<\/span>{<\/span> days<\/span>:<\/span> 0<\/span>,<\/span> hours<\/span>:<\/span> 0<\/span>,<\/span> minutes<\/span>:<\/span> 0<\/span> }<\/span>)<\/span>;<\/span><\/p>\n

    const<\/span> calculateDifference<\/span> =<\/span> (<\/span>)<\/span> =><\/span> {<\/span>
    \n const<\/span> start =<\/span> new<\/span> Date<\/span>(<\/span>startDate)<\/span>;<\/span>
    \n const<\/span> end =<\/span> new<\/span> Date<\/span>(<\/span>endDate)<\/span>;<\/span>
    \n const<\/span> diff =<\/span> end.<\/span>getTime<\/span>(<\/span>)<\/span> –<\/span> start.<\/span>getTime<\/span>(<\/span>)<\/span>;<\/span><\/p>\n

    const<\/span> days =<\/span> Math.<\/span>floor<\/span>(<\/span>diff \/<\/span> (<\/span>1000<\/span> *<\/span> 60<\/span> *<\/span> 60<\/span> *<\/span> 24<\/span>)<\/span>)<\/span>;<\/span>
    \n const<\/span> hours =<\/span> Math.<\/span>floor<\/span>(<\/span>(<\/span>diff %<\/span> (<\/span>1000<\/span> *<\/span> 60<\/span> *<\/span> 60<\/span> *<\/span> 24<\/span>)<\/span>)<\/span> \/<\/span> (<\/span>1000<\/span> *<\/span> 60<\/span> *<\/span> 60<\/span>)<\/span>)<\/span>;<\/span>
    \n const<\/span> minutes =<\/span> Math.<\/span>floor<\/span>(<\/span>(<\/span>diff %<\/span> (<\/span>1000<\/span> *<\/span> 60<\/span> *<\/span> 60<\/span>)<\/span>)<\/span> \/<\/span> (<\/span>1000<\/span> *<\/span> 60<\/span>)<\/span>)<\/span>;<\/span><\/p>\n

    setDifference<\/span>(<\/span>{<\/span> days,<\/span> hours,<\/span> minutes }<\/span>)<\/span>;<\/span>
    \n }<\/span>;<\/span><\/p>\n

    return<\/span> (<\/span>
    \n <<\/span>View style=<\/span>{<\/span>styles.<\/span>container}<\/span>><\/span>
    \n <<\/span>TextInput
    \n style=<\/span>{<\/span>styles.<\/span>input}<\/span>
    \n value=<\/span>{<\/span>startDate}<\/span>
    \n onChangeText=<\/span>{<\/span>setStartDate}<\/span>
    \n placeholder=<\/span>"\u5f00\u59cb\u65e5\u671f (YYYY-MM-DD)"<\/span>
    \n \/<\/span>><\/span>
    \n <<\/span>TextInput
    \n style=<\/span>{<\/span>styles.<\/span>input}<\/span>
    \n value=<\/span>{<\/span>endDate}<\/span>
    \n onChangeText=<\/span>{<\/span>setEndDate}<\/span>
    \n placeholder=<\/span>"\u7ed3\u675f\u65e5\u671f (YYYY-MM-DD)"<\/span>
    \n \/<\/span>><\/span>
    \n <<\/span>TouchableOpacity style=<\/span>{<\/span>styles.<\/span>button}<\/span> onPress=<\/span>{<\/span>calculateDifference}<\/span>><\/span>
    \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>buttonText}<\/span>><\/span>\u8ba1\u7b97\u5dee\u503c<<\/span>\/<\/span>Text><\/span>
    \n <<\/span>\/<\/span>TouchableOpacity><\/span>
    \n <<\/span>View style=<\/span>{<\/span>styles.<\/span>resultContainer}<\/span>><\/span>
    \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>resultText}<\/span>><\/span>\u76f8\u5dee:<\/span> {<\/span>difference.<\/span>days}<\/span> \u5929 {<\/span>difference.<\/span>hours}<\/span> \u5c0f\u65f6 {<\/span>difference.<\/span>minutes}<\/span> \u5206\u949f<<\/span>\/<\/span>Text><\/span>
    \n <<\/span>\/<\/span>View><\/span>
    \n <<\/span>\/<\/span>View><\/span>
    \n )<\/span>;<\/span>
    \n}<\/span>;<\/span><\/p>\n

    const<\/span> styles =<\/span> StyleSheet.<\/span>create<\/span>(<\/span>{<\/span>
    \n container<\/span>:<\/span> {<\/span>
    \n padding<\/span>:<\/span> 20<\/span>,<\/span>
    \n }<\/span>,<\/span>
    \n input<\/span>:<\/span> {<\/span>
    \n borderWidth<\/span>:<\/span> 1<\/span>,<\/span>
    \n borderColor<\/span>:<\/span> '#DCDFE6'<\/span>,<\/span>
    \n borderRadius<\/span>:<\/span> 8<\/span>,<\/span>
    \n padding<\/span>:<\/span> 12<\/span>,<\/span>
    \n marginBottom<\/span>:<\/span> 12<\/span>,<\/span>
    \n fontSize<\/span>:<\/span> 16<\/span>,<\/span>
    \n }<\/span>,<\/span>
    \n button<\/span>:<\/span> {<\/span>
    \n backgroundColor<\/span>:<\/span> '#409EFF'<\/span>,<\/span>
    \n borderRadius<\/span>:<\/span> 8<\/span>,<\/span>
    \n paddingVertical<\/span>:<\/span> 14<\/span>,<\/span>
    \n paddingHorizontal<\/span>:<\/span> 20<\/span>,<\/span>
    \n alignItems<\/span>:<\/span> 'center'<\/span>,<\/span>
    \n marginBottom<\/span>:<\/span> 12<\/span>,<\/span>
    \n }<\/span>,<\/span>
    \n buttonText<\/span>:<\/span> {<\/span>
    \n color<\/span>:<\/span> '#FFFFFF'<\/span>,<\/span>
    \n fontSize<\/span>:<\/span> 16<\/span>,<\/span>
    \n fontWeight<\/span>:<\/span> '600'<\/span>,<\/span>
    \n }<\/span>,<\/span>
    \n resultContainer<\/span>:<\/span> {<\/span>
    \n backgroundColor<\/span>:<\/span> '#E6F7FF'<\/span>,<\/span>
    \n borderRadius<\/span>:<\/span> 8<\/span>,<\/span>
    \n padding<\/span>:<\/span> 16<\/span>,<\/span>
    \n }<\/span>,<\/span>
    \n resultText<\/span>:<\/span> {<\/span>
    \n fontSize<\/span>:<\/span> 16<\/span>,<\/span>
    \n color<\/span>:<\/span> '#303133'<\/span>,<\/span>
    \n }<\/span>,<\/span>
    \n}<\/span>)<\/span>;<\/span><\/p>\n

    export<\/span> default<\/span> DateDifference;<\/span><\/p>\n

    \u6838\u5fc3\u8981\u70b9：<\/p>\n

      \n
    • \u8ba1\u7b97\u4e24\u4e2a\u65e5\u671f\u7684\u65f6\u95f4\u6233\u5dee\u503c<\/li>\n
    • \u8f6c\u6362\u4e3a\u5929\u3001\u5c0f\u65f6\u3001\u5206\u949f<\/li>\n
    • \u5904\u7406\u65e5\u671f\u683c\u5f0f\u9a8c\u8bc1<\/li>\n
    • \u9e3f\u8499\u7aef\u65e5\u671f\u5dee\u503c\u8ba1\u7b97\u6b63\u5e38<\/li>\n<\/ul>\n

      3. \u5de5\u4f5c\u65e5\u8ba1\u7b97<\/h4>\n

      \u5b9e\u73b0\u5de5\u4f5c\u65e5\u8ba1\u7b97\u529f\u80fd\u3002<\/p>\n

      const<\/span> calculateWorkingDays =<\/span> (<\/span>startDate:<\/span> Date,<\/span> endDate<\/span>:<\/span> Date)<\/span>:<\/span> number<\/span> =><\/span> {<\/span>
      \n let<\/span> count =<\/span> 0<\/span>;<\/span>
      \n let<\/span> current =<\/span> new<\/span> Date<\/span>(<\/span>startDate)<\/span>;<\/span><\/p>\n

      while<\/span> (<\/span>current <=<\/span> endDate)<\/span> {<\/span>
      \n const<\/span> dayOfWeek =<\/span> current.<\/span>getDay<\/span>(<\/span>)<\/span>;<\/span>
      \n if<\/span> (<\/span>dayOfWeek !==<\/span> 0<\/span> &&<\/span> dayOfWeek !==<\/span> 6<\/span>)<\/span> {<\/span> \/\/ \u6392\u9664\u5468\u516d\u5468\u65e5<\/span>
      \n count++<\/span>;<\/span>
      \n }<\/span>
      \n current.<\/span>setDate<\/span>(<\/span>current.<\/span>getDate<\/span>(<\/span>)<\/span> +<\/span> 1<\/span>)<\/span>;<\/span>
      \n }<\/span><\/p>\n

      return<\/span> count;<\/span>
      \n}<\/span>;<\/span><\/p>\n

      const<\/span> isWeekend =<\/span> (<\/span>date:<\/span> Date)<\/span>:<\/span> boolean<\/span> =><\/span> {<\/span>
      \n const<\/span> dayOfWeek =<\/span> date.<\/span>getDay<\/span>(<\/span>)<\/span>;<\/span>
      \n return<\/span> dayOfWeek ===<\/span> 0<\/span> ||<\/span> dayOfWeek ===<\/span> 6<\/span>;<\/span>
      \n}<\/span>;<\/span><\/p>\n

      const<\/span> isHoliday =<\/span> (<\/span>date:<\/span> Date)<\/span>:<\/span> boolean<\/span> =><\/span> {<\/span>
      \n \/\/ \u53ef\u4ee5\u6dfb\u52a0\u8282\u5047\u65e5\u5224\u65ad\u903b\u8f91<\/span>
      \n return<\/span> false<\/span>;<\/span>
      \n}<\/span>;<\/span><\/p>\n

      const<\/span> getNextWorkingDay =<\/span> (<\/span>date:<\/span> Date)<\/span>:<\/span> Date<\/span> =><\/span> {<\/span>
      \n let<\/span> next =<\/span> new<\/span> Date<\/span>(<\/span>date)<\/span>;<\/span>
      \n next.<\/span>setDate<\/span>(<\/span>next.<\/span>getDate<\/span>(<\/span>)<\/span> +<\/span> 1<\/span>)<\/span>;<\/span><\/p>\n

      while<\/span> (<\/span>isWeekend<\/span>(<\/span>next)<\/span> ||<\/span> isHoliday<\/span>(<\/span>next)<\/span>)<\/span> {<\/span>
      \n next.<\/span>setDate<\/span>(<\/span>next.<\/span>getDate<\/span>(<\/span>)<\/span> +<\/span> 1<\/span>)<\/span>;<\/span>
      \n }<\/span><\/p>\n

      return<\/span> next;<\/span>
      \n}<\/span>;<\/span><\/p>\n

      \/\/ \u4f7f\u7528\u793a\u4f8b<\/span>
      \nconst<\/span> workingDays =<\/span> calculateWorkingDays<\/span>(<\/span>new<\/span> Date<\/span>(<\/span>'2024-01-01'<\/span>)<\/span>,<\/span> new<\/span> Date<\/span>(<\/span>'2024-01-31'<\/span>)<\/span>)<\/span>;<\/span>
      \nconst<\/span> nextWorkingDay =<\/span> getNextWorkingDay<\/span>(<\/span>new<\/span> Date<\/span>(<\/span>)<\/span>)<\/span>;<\/span><\/p>\n

      \u6838\u5fc3\u8981\u70b9：<\/p>\n

        \n
      • \u5224\u65ad\u5de5\u4f5c\u65e5\u548c\u5468\u672b<\/li>\n
      • \u8ba1\u7b97\u5de5\u4f5c\u65e5\u6570\u91cf<\/li>\n
      • \u83b7\u53d6\u4e0b\u4e00\u4e2a\u5de5\u4f5c\u65e5<\/li>\n
      • \u9e3f\u8499\u7aef\u5de5\u4f5c\u65e5\u8ba1\u7b97\u6b63\u5e38<\/li>\n<\/ul>\n
        \n

        \u4e09\u3001\u5b9e\u6218\u5b8c\u6574\u7248：\u4f01\u4e1a\u7ea7\u901a\u7528\u65e5\u671f\u8ba1\u7b97\u5de5\u5177\u7ec4\u4ef6<\/h3>\n

        import<\/span> React,<\/span> {<\/span> useState,<\/span> useCallback }<\/span> from<\/span> 'react'<\/span>;<\/span>
        \nimport<\/span> {<\/span>
        \n View,<\/span>
        \n Text,<\/span>
        \n StyleSheet,<\/span>
        \n TouchableOpacity,<\/span>
        \n ScrollView,<\/span>
        \n SafeAreaView,<\/span>
        \n TextInput,<\/span>
        \n}<\/span> from<\/span> 'react-native'<\/span>;<\/span><\/p>\n

        const<\/span> DateCalculationTool<\/span> =<\/span> (<\/span>)<\/span> =><\/span> {<\/span>
        \n \/\/ \u65e5\u671f\u52a0\u51cf<\/span>
        \n const<\/span> [<\/span>baseDate,<\/span> setBaseDate]<\/span> =<\/span> useState<<\/span>string><\/span>(<\/span>new<\/span> Date<\/span>(<\/span>)<\/span>.<\/span>toISOString<\/span>(<\/span>)<\/span>.<\/span>split<\/span>(<\/span>'T'<\/span>)<\/span>[<\/span>0<\/span>]<\/span>)<\/span>;<\/span>
        \n const<\/span> [<\/span>daysToAdd,<\/span> setDaysToAdd]<\/span> =<\/span> useState<<\/span>string><\/span>(<\/span>'7'<\/span>)<\/span>;<\/span>
        \n const<\/span> [<\/span>addResult,<\/span> setAddResult]<\/span> =<\/span> useState<<\/span>string><\/span>(<\/span>''<\/span>)<\/span>;<\/span><\/p>\n

        \/\/ \u65e5\u671f\u5dee\u503c<\/span>
        \n const<\/span> [<\/span>startDate,<\/span> setStartDate]<\/span> =<\/span> useState<<\/span>string><\/span>(<\/span>new<\/span> Date<\/span>(<\/span>)<\/span>.<\/span>toISOString<\/span>(<\/span>)<\/span>.<\/span>split<\/span>(<\/span>'T'<\/span>)<\/span>[<\/span>0<\/span>]<\/span>)<\/span>;<\/span>
        \n const<\/span> [<\/span>endDate,<\/span> setEndDate]<\/span> =<\/span> useState<<\/span>string><\/span>(<\/span>new<\/span> Date<\/span>(<\/span>)<\/span>.<\/span>toISOString<\/span>(<\/span>)<\/span>.<\/span>split<\/span>(<\/span>'T'<\/span>)<\/span>[<\/span>0<\/span>]<\/span>)<\/span>;<\/span>
        \n const<\/span> [<\/span>difference,<\/span> setDifference]<\/span> =<\/span> useState<<\/span>{<\/span> days<\/span>:<\/span> number;<\/span> hours:<\/span> number;<\/span> minutes:<\/span> number }<\/span>><\/span>(<\/span>{<\/span> days<\/span>:<\/span> 0<\/span>,<\/span> hours<\/span>:<\/span> 0<\/span>,<\/span> minutes<\/span>:<\/span> 0<\/span> }<\/span>)<\/span>;<\/span><\/p>\n

        \/\/ \u5de5\u4f5c\u65e5\u8ba1\u7b97<\/span>
        \n const<\/span> [<\/span>workStartDate,<\/span> setWorkStartDate]<\/span> =<\/span> useState<<\/span>string><\/span>(<\/span>new<\/span> Date<\/span>(<\/span>)<\/span>.<\/span>toISOString<\/span>(<\/span>)<\/span>.<\/span>split<\/span>(<\/span>'T'<\/span>)<\/span>[<\/span>0<\/span>]<\/span>)<\/span>;<\/span>
        \n const<\/span> [<\/span>workEndDate,<\/span> setWorkEndDate]<\/span> =<\/span> useState<<\/span>string><\/span>(<\/span>new<\/span> Date<\/span>(<\/span>)<\/span>.<\/span>toISOString<\/span>(<\/span>)<\/span>.<\/span>split<\/span>(<\/span>'T'<\/span>)<\/span>[<\/span>0<\/span>]<\/span>)<\/span>;<\/span>
        \n const<\/span> [<\/span>workingDays,<\/span> setWorkingDays]<\/span> =<\/span> useState<<\/span>number><\/span>(<\/span>0<\/span>)<\/span>;<\/span><\/p>\n

        \/\/ \u65e5\u671f\u52a0\u51cf<\/span>
        \n const<\/span> handleAddDays =<\/span> useCallback<\/span>(<\/span>(<\/span>)<\/span> =><\/span> {<\/span>
        \n const<\/span> date =<\/span> new<\/span> Date<\/span>(<\/span>baseDate)<\/span>;<\/span>
        \n const<\/span> days =<\/span> parseInt<\/span>(<\/span>daysToAdd)<\/span> ||<\/span> 0<\/span>;<\/span>
        \n date.<\/span>setDate<\/span>(<\/span>date.<\/span>getDate<\/span>(<\/span>)<\/span> +<\/span> days)<\/span>;<\/span>
        \n setAddResult<\/span>(<\/span>date.<\/span>toISOString<\/span>(<\/span>)<\/span>.<\/span>split<\/span>(<\/span>'T'<\/span>)<\/span>[<\/span>0<\/span>]<\/span>)<\/span>;<\/span>
        \n }<\/span>,<\/span> [<\/span>baseDate,<\/span> daysToAdd]<\/span>)<\/span>;<\/span><\/p>\n

        const<\/span> handleSubtractDays =<\/span> useCallback<\/span>(<\/span>(<\/span>)<\/span> =><\/span> {<\/span>
        \n const<\/span> date =<\/span> new<\/span> Date<\/span>(<\/span>baseDate)<\/span>;<\/span>
        \n const<\/span> days =<\/span> parseInt<\/span>(<\/span>daysToAdd)<\/span> ||<\/span> 0<\/span>;<\/span>
        \n date.<\/span>setDate<\/span>(<\/span>date.<\/span>getDate<\/span>(<\/span>)<\/span> –<\/span> days)<\/span>;<\/span>
        \n setAddResult<\/span>(<\/span>date.<\/span>toISOString<\/span>(<\/span>)<\/span>.<\/span>split<\/span>(<\/span>'T'<\/span>)<\/span>[<\/span>0<\/span>]<\/span>)<\/span>;<\/span>
        \n }<\/span>,<\/span> [<\/span>baseDate,<\/span> daysToAdd]<\/span>)<\/span>;<\/span><\/p>\n

        \/\/ \u65e5\u671f\u5dee\u503c<\/span>
        \n const<\/span> handleCalculateDifference =<\/span> useCallback<\/span>(<\/span>(<\/span>)<\/span> =><\/span> {<\/span>
        \n const<\/span> start =<\/span> new<\/span> Date<\/span>(<\/span>startDate)<\/span>;<\/span>
        \n const<\/span> end =<\/span> new<\/span> Date<\/span>(<\/span>endDate)<\/span>;<\/span>
        \n const<\/span> diff =<\/span> end.<\/span>getTime<\/span>(<\/span>)<\/span> –<\/span> start.<\/span>getTime<\/span>(<\/span>)<\/span>;<\/span><\/p>\n

        const<\/span> days =<\/span> Math.<\/span>floor<\/span>(<\/span>diff \/<\/span> (<\/span>1000<\/span> *<\/span> 60<\/span> *<\/span> 60<\/span> *<\/span> 24<\/span>)<\/span>)<\/span>;<\/span>
        \n const<\/span> hours =<\/span> Math.<\/span>floor<\/span>(<\/span>(<\/span>diff %<\/span> (<\/span>1000<\/span> *<\/span> 60<\/span> *<\/span> 60<\/span> *<\/span> 24<\/span>)<\/span>)<\/span> \/<\/span> (<\/span>1000<\/span> *<\/span> 60<\/span> *<\/span> 60<\/span>)<\/span>)<\/span>;<\/span>
        \n const<\/span> minutes =<\/span> Math.<\/span>floor<\/span>(<\/span>(<\/span>diff %<\/span> (<\/span>1000<\/span> *<\/span> 60<\/span> *<\/span> 60<\/span>)<\/span>)<\/span> \/<\/span> (<\/span>1000<\/span> *<\/span> 60<\/span>)<\/span>)<\/span>;<\/span><\/p>\n

        setDifference<\/span>(<\/span>{<\/span> days,<\/span> hours,<\/span> minutes }<\/span>)<\/span>;<\/span>
        \n }<\/span>,<\/span> [<\/span>startDate,<\/span> endDate]<\/span>)<\/span>;<\/span><\/p>\n

        \/\/ \u5de5\u4f5c\u65e5\u8ba1\u7b97<\/span>
        \n const<\/span> calculateWorkingDays =<\/span> useCallback<\/span>(<\/span>(<\/span>start:<\/span> Date,<\/span> end<\/span>:<\/span> Date)<\/span>:<\/span> number<\/span> =><\/span> {<\/span>
        \n let<\/span> count =<\/span> 0<\/span>;<\/span>
        \n let<\/span> current =<\/span> new<\/span> Date<\/span>(<\/span>start)<\/span>;<\/span><\/p>\n

        while<\/span> (<\/span>current <=<\/span> end)<\/span> {<\/span>
        \n const<\/span> dayOfWeek =<\/span> current.<\/span>getDay<\/span>(<\/span>)<\/span>;<\/span>
        \n if<\/span> (<\/span>dayOfWeek !==<\/span> 0<\/span> &&<\/span> dayOfWeek !==<\/span> 6<\/span>)<\/span> {<\/span>
        \n count++<\/span>;<\/span>
        \n }<\/span>
        \n current.<\/span>setDate<\/span>(<\/span>current.<\/span>getDate<\/span>(<\/span>)<\/span> +<\/span> 1<\/span>)<\/span>;<\/span>
        \n }<\/span><\/p>\n

        return<\/span> count;<\/span>
        \n }<\/span>,<\/span> [<\/span>]<\/span>)<\/span>;<\/span><\/p>\n

        const<\/span> handleCalculateWorkingDays =<\/span> useCallback<\/span>(<\/span>(<\/span>)<\/span> =><\/span> {<\/span>
        \n const<\/span> start =<\/span> new<\/span> Date<\/span>(<\/span>workStartDate)<\/span>;<\/span>
        \n const<\/span> end =<\/span> new<\/span> Date<\/span>(<\/span>workEndDate)<\/span>;<\/span>
        \n const<\/span> days =<\/span> calculateWorkingDays<\/span>(<\/span>start,<\/span> end)<\/span>;<\/span>
        \n setWorkingDays<\/span>(<\/span>days)<\/span>;<\/span>
        \n }<\/span>,<\/span> [<\/span>workStartDate,<\/span> workEndDate,<\/span> calculateWorkingDays]<\/span>)<\/span>;<\/span><\/p>\n

        \/\/ \u5224\u65ad\u662f\u5426\u4e3a\u5468\u672b<\/span>
        \n const<\/span> isWeekend =<\/span> useCallback<\/span>(<\/span>(<\/span>dateStr:<\/span> string)<\/span>:<\/span> boolean<\/span> =><\/span> {<\/span>
        \n const<\/span> date =<\/span> new<\/span> Date<\/span>(<\/span>dateStr)<\/span>;<\/span>
        \n const<\/span> dayOfWeek =<\/span> date.<\/span>getDay<\/span>(<\/span>)<\/span>;<\/span>
        \n return<\/span> dayOfWeek ===<\/span> 0<\/span> ||<\/span> dayOfWeek ===<\/span> 6<\/span>;<\/span>
        \n }<\/span>,<\/span> [<\/span>]<\/span>)<\/span>;<\/span><\/p>\n

        \/\/ \u83b7\u53d6\u661f\u671f\u51e0<\/span>
        \n const<\/span> getDayOfWeek =<\/span> useCallback<\/span>(<\/span>(<\/span>dateStr:<\/span> string)<\/span>:<\/span> string<\/span> =><\/span> {<\/span>
        \n const<\/span> date =<\/span> new<\/span> Date<\/span>(<\/span>dateStr)<\/span>;<\/span>
        \n const<\/span> days =<\/span> [<\/span>'\u5468\u65e5'<\/span>,<\/span> '\u5468\u4e00'<\/span>,<\/span> '\u5468\u4e8c'<\/span>,<\/span> '\u5468\u4e09'<\/span>,<\/span> '\u5468\u56db'<\/span>,<\/span> '\u5468\u4e94'<\/span>,<\/span> '\u5468\u516d'<\/span>]<\/span>;<\/span>
        \n return<\/span> days[<\/span>date.<\/span>getDay<\/span>(<\/span>)<\/span>]<\/span>;<\/span>
        \n }<\/span>,<\/span> [<\/span>]<\/span>)<\/span>;<\/span><\/p>\n

        \/\/ \u683c\u5f0f\u5316\u65e5\u671f<\/span>
        \n const<\/span> formatDate =<\/span> useCallback<\/span>(<\/span>(<\/span>dateStr:<\/span> string)<\/span>:<\/span> string<\/span> =><\/span> {<\/span>
        \n const<\/span> date =<\/span> new<\/span> Date<\/span>(<\/span>dateStr)<\/span>;<\/span>
        \n return<\/span> `<\/span>${<\/span>date.<\/span>getFullYear<\/span>(<\/span>)<\/span>}<\/span><\/span>\u5e74<\/span>${<\/span>date.<\/span>getMonth<\/span>(<\/span>)<\/span> +<\/span> 1<\/span>}<\/span><\/span>\u6708<\/span>${<\/span>date.<\/span>getDate<\/span>(<\/span>)<\/span>}<\/span><\/span>\u65e5<\/span>`<\/span><\/span>;<\/span>
        \n }<\/span>,<\/span> [<\/span>]<\/span>)<\/span>;<\/span><\/p>\n

        return<\/span> (<\/span>
        \n <<\/span>SafeAreaView style=<\/span>{<\/span>styles.<\/span>container}<\/span>><\/span>
        \n <<\/span>ScrollView style=<\/span>{<\/span>styles.<\/span>scrollView}<\/span> contentContainerStyle=<\/span>{<\/span>styles.<\/span>scrollContent}<\/span>><\/span>
        \n {<\/span>\/* \u65e5\u671f\u52a0\u51cf *\/<\/span>}<\/span>
        \n <<\/span>View style=<\/span>{<\/span>styles.<\/span>section}<\/span>><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>sectionTitle}<\/span>><\/span>\u65e5\u671f\u52a0\u51cf<<\/span>\/<\/span>Text><\/span>
        \n <<\/span>View style=<\/span>{<\/span>styles.<\/span>card}<\/span>><\/span>
        \n <<\/span>TextInput
        \n style=<\/span>{<\/span>styles.<\/span>input}<\/span>
        \n value=<\/span>{<\/span>baseDate}<\/span>
        \n onChangeText=<\/span>{<\/span>setBaseDate}<\/span>
        \n placeholder=<\/span>"\u57fa\u7840\u65e5\u671f (YYYY-MM-DD)"<\/span>
        \n \/<\/span>><\/span>
        \n <<\/span>TextInput
        \n style=<\/span>{<\/span>styles.<\/span>input}<\/span>
        \n value=<\/span>{<\/span>daysToAdd}<\/span>
        \n onChangeText=<\/span>{<\/span>setDaysToAdd}<\/span>
        \n keyboardType=<\/span>"number-pad"<\/span>
        \n placeholder=<\/span>"\u5929\u6570"<\/span>
        \n \/<\/span>><\/span>
        \n <<\/span>View style=<\/span>{<\/span>styles.<\/span>buttonRow}<\/span>><\/span>
        \n <<\/span>TouchableOpacity style=<\/span>{<\/span>[<\/span>styles.<\/span>button,<\/span> styles.<\/span>addButton]<\/span>}<\/span> onPress=<\/span>{<\/span>handleAddDays}<\/span>><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>buttonText}<\/span>><\/span>\u52a0\u5929\u6570<<\/span>\/<\/span>Text><\/span>
        \n <<\/span>\/<\/span>TouchableOpacity><\/span>
        \n <<\/span>TouchableOpacity style=<\/span>{<\/span>[<\/span>styles.<\/span>button,<\/span> styles.<\/span>subtractButton]<\/span>}<\/span> onPress=<\/span>{<\/span>handleSubtractDays}<\/span>><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>buttonText}<\/span>><\/span>\u51cf\u5929\u6570<<\/span>\/<\/span>Text><\/span>
        \n <<\/span>\/<\/span>TouchableOpacity><\/span>
        \n <<\/span>\/<\/span>View><\/span>
        \n {<\/span>addResult &&<\/span> (<\/span>
        \n <<\/span>View style=<\/span>{<\/span>styles.<\/span>resultBox}<\/span>><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>resultLabel}<\/span>><\/span>\u8ba1\u7b97\u7ed3\u679c:<\/span><<\/span>\/<\/span>Text><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>resultText}<\/span>><\/span>{<\/span>formatDate<\/span>(<\/span>addResult)<\/span>}<\/span><<\/span>\/<\/span>Text><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>resultSubText}<\/span>><\/span>{<\/span>getDayOfWeek<\/span>(<\/span>addResult)<\/span>}<\/span><<\/span>\/<\/span>Text><\/span>
        \n <<\/span>\/<\/span>View><\/span>
        \n )<\/span>}<\/span>
        \n <<\/span>\/<\/span>View><\/span>
        \n <<\/span>\/<\/span>View><\/span><\/p>\n

        {<\/span>\/* \u65e5\u671f\u5dee\u503c *\/<\/span>}<\/span>
        \n <<\/span>View style=<\/span>{<\/span>styles.<\/span>section}<\/span>><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>sectionTitle}<\/span>><\/span>\u65e5\u671f\u5dee\u503c<<\/span>\/<\/span>Text><\/span>
        \n <<\/span>View style=<\/span>{<\/span>styles.<\/span>card}<\/span>><\/span>
        \n <<\/span>TextInput
        \n style=<\/span>{<\/span>styles.<\/span>input}<\/span>
        \n value=<\/span>{<\/span>startDate}<\/span>
        \n onChangeText=<\/span>{<\/span>setStartDate}<\/span>
        \n placeholder=<\/span>"\u5f00\u59cb\u65e5\u671f (YYYY-MM-DD)"<\/span>
        \n \/<\/span>><\/span>
        \n <<\/span>TextInput
        \n style=<\/span>{<\/span>styles.<\/span>input}<\/span>
        \n value=<\/span>{<\/span>endDate}<\/span>
        \n onChangeText=<\/span>{<\/span>setEndDate}<\/span>
        \n placeholder=<\/span>"\u7ed3\u675f\u65e5\u671f (YYYY-MM-DD)"<\/span>
        \n \/<\/span>><\/span>
        \n <<\/span>TouchableOpacity style=<\/span>{<\/span>styles.<\/span>button}<\/span> onPress=<\/span>{<\/span>handleCalculateDifference}<\/span>><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>buttonText}<\/span>><\/span>\u8ba1\u7b97\u5dee\u503c<<\/span>\/<\/span>Text><\/span>
        \n <<\/span>\/<\/span>TouchableOpacity><\/span>
        \n {<\/span>difference.<\/span>days !==<\/span> 0<\/span> ||<\/span> difference.<\/span>hours !==<\/span> 0<\/span> ||<\/span> difference.<\/span>minutes !==<\/span> 0<\/span> ?<\/span> (<\/span>
        \n <<\/span>View style=<\/span>{<\/span>styles.<\/span>resultBox}<\/span>><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>resultLabel}<\/span>><\/span>\u76f8\u5dee\u65f6\u95f4:<\/span><<\/span>\/<\/span>Text><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>resultText}<\/span>><\/span>
        \n {<\/span>difference.<\/span>days}<\/span> \u5929 {<\/span>difference.<\/span>hours}<\/span> \u5c0f\u65f6 {<\/span>difference.<\/span>minutes}<\/span> \u5206\u949f
        \n <<\/span>\/<\/span>Text><\/span>
        \n <<\/span>\/<\/span>View><\/span>
        \n )<\/span> :<\/span> null<\/span>}<\/span>
        \n <<\/span>\/<\/span>View><\/span>
        \n <<\/span>\/<\/span>View><\/span><\/p>\n

        {<\/span>\/* \u5de5\u4f5c\u65e5\u8ba1\u7b97 *\/<\/span>}<\/span>
        \n <<\/span>View style=<\/span>{<\/span>styles.<\/span>section}<\/span>><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>sectionTitle}<\/span>><\/span>\u5de5\u4f5c\u65e5\u8ba1\u7b97<<\/span>\/<\/span>Text><\/span>
        \n <<\/span>View style=<\/span>{<\/span>styles.<\/span>card}<\/span>><\/span>
        \n <<\/span>TextInput
        \n style=<\/span>{<\/span>styles.<\/span>input}<\/span>
        \n value=<\/span>{<\/span>workStartDate}<\/span>
        \n onChangeText=<\/span>{<\/span>setWorkStartDate}<\/span>
        \n placeholder=<\/span>"\u5f00\u59cb\u65e5\u671f (YYYY-MM-DD)"<\/span>
        \n \/<\/span>><\/span>
        \n <<\/span>TextInput
        \n style=<\/span>{<\/span>styles.<\/span>input}<\/span>
        \n value=<\/span>{<\/span>workEndDate}<\/span>
        \n onChangeText=<\/span>{<\/span>setWorkEndDate}<\/span>
        \n placeholder=<\/span>"\u7ed3\u675f\u65e5\u671f (YYYY-MM-DD)"<\/span>
        \n \/<\/span>><\/span>
        \n <<\/span>TouchableOpacity style=<\/span>{<\/span>styles.<\/span>button}<\/span> onPress=<\/span>{<\/span>handleCalculateWorkingDays}<\/span>><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>buttonText}<\/span>><\/span>\u8ba1\u7b97\u5de5\u4f5c\u65e5<<\/span>\/<\/span>Text><\/span>
        \n <<\/span>\/<\/span>TouchableOpacity><\/span>
        \n {<\/span>workingDays ><\/span> 0<\/span> &&<\/span> (<\/span>
        \n <<\/span>View style=<\/span>{<\/span>styles.<\/span>resultBox}<\/span>><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>resultLabel}<\/span>><\/span>\u5de5\u4f5c\u65e5\u6570\u91cf:<\/span><<\/span>\/<\/span>Text><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>resultText}<\/span>><\/span>{<\/span>workingDays}<\/span> \u5929<<\/span>\/<\/span>Text><\/span>
        \n <<\/span>\/<\/span>View><\/span>
        \n )<\/span>}<\/span>
        \n <<\/span>\/<\/span>View><\/span>
        \n <<\/span>\/<\/span>View><\/span><\/p>\n

        {<\/span>\/* \u65e5\u671f\u4fe1\u606f *\/<\/span>}<\/span>
        \n <<\/span>View style=<\/span>{<\/span>styles.<\/span>section}<\/span>><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>sectionTitle}<\/span>><\/span>\u65e5\u671f\u4fe1\u606f<<\/span>\/<\/span>Text><\/span>
        \n <<\/span>View style=<\/span>{<\/span>styles.<\/span>card}<\/span>><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>infoText}<\/span>><\/span>\u57fa\u7840\u65e5\u671f:<\/span> {<\/span>formatDate<\/span>(<\/span>baseDate)<\/span>}<\/span><<\/span>\/<\/span>Text><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>infoText}<\/span>><\/span>\u661f\u671f:<\/span> {<\/span>getDayOfWeek<\/span>(<\/span>baseDate)<\/span>}<\/span><<\/span>\/<\/span>Text><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>[<\/span>styles.<\/span>infoText,<\/span> isWeekend<\/span>(<\/span>baseDate)<\/span> &&<\/span> styles.<\/span>weekendText]<\/span>}<\/span>><\/span>
        \n {<\/span>isWeekend<\/span>(<\/span>baseDate)<\/span> ?<\/span> '\u5468\u672b'<\/span> :<\/span> '\u5de5\u4f5c\u65e5'<\/span>}<\/span>
        \n <<\/span>\/<\/span>Text><\/span>
        \n <<\/span>\/<\/span>View><\/span>
        \n <<\/span>\/<\/span>View><\/span><\/p>\n

        {<\/span>\/* \u4f7f\u7528\u8bf4\u660e *\/<\/span>}<\/span>
        \n <<\/span>View style=<\/span>{<\/span>styles.<\/span>section}<\/span>><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>sectionTitle}<\/span>><\/span>\u4f7f\u7528\u8bf4\u660e<<\/span>\/<\/span>Text><\/span>
        \n <<\/span>View style=<\/span>{<\/span>styles.<\/span>instructionCard}<\/span>><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>instructionText}<\/span>><\/span>
        \n \u2022 \u65e5\u671f\u52a0\u51cf：\u8f93\u5165\u57fa\u7840\u65e5\u671f\u548c\u5929\u6570，\u8ba1\u7b97\u52a0\u6216\u51cf\u540e\u7684\u65e5\u671f
        \n <<\/span>\/<\/span>Text><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>instructionText}<\/span>><\/span>
        \n \u2022 \u65e5\u671f\u5dee\u503c：\u8ba1\u7b97\u4e24\u4e2a\u65e5\u671f\u4e4b\u95f4\u7684\u65f6\u95f4\u5dee
        \n <<\/span>\/<\/span>Text><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>instructionText}<\/span>><\/span>
        \n \u2022 \u5de5\u4f5c\u65e5\u8ba1\u7b97：\u8ba1\u7b97\u4e24\u4e2a\u65e5\u671f\u4e4b\u95f4\u7684\u5de5\u4f5c\u65e5\u6570\u91cf（\u6392\u9664\u5468\u672b）
        \n <<\/span>\/<\/span>Text><\/span>
        \n <<\/span>Text style=<\/span>{<\/span>styles.<\/span>instructionText}<\/span>><\/span>
        \n \u2022 \u9002\u7528\u4e8e\u9879\u76ee\u6392\u671f\u3001\u4efb\u52a1\u89c4\u5212\u3001\u65e5\u7a0b\u7ba1\u7406\u7b49\u573a\u666f
        \n <<\/span>\/<\/span>Text><\/span>
        \n <<\/span>\/<\/span>View><\/span>
        \n <<\/span>\/<\/span>View><\/span>
        \n <<\/span>\/<\/span>ScrollView><\/span>
        \n <<\/span>\/<\/span>SafeAreaView><\/span>
        \n )<\/span>;<\/span>
        \n}<\/span>;<\/span><\/p>\n

        const<\/span> styles =<\/span> StyleSheet.<\/span>create<\/span>(<\/span>{<\/span>
        \n container<\/span>:<\/span> {<\/span>
        \n flex<\/span>:<\/span> 1<\/span>,<\/span>
        \n backgroundColor<\/span>:<\/span> '#F5F7FA'<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n scrollView<\/span>:<\/span> {<\/span>
        \n flex<\/span>:<\/span> 1<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n scrollContent<\/span>:<\/span> {<\/span>
        \n padding<\/span>:<\/span> 20<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n section<\/span>:<\/span> {<\/span>
        \n marginBottom<\/span>:<\/span> 24<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n sectionTitle<\/span>:<\/span> {<\/span>
        \n fontSize<\/span>:<\/span> 18<\/span>,<\/span>
        \n fontWeight<\/span>:<\/span> '600'<\/span>,<\/span>
        \n color<\/span>:<\/span> '#303133'<\/span>,<\/span>
        \n marginBottom<\/span>:<\/span> 12<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n card<\/span>:<\/span> {<\/span>
        \n backgroundColor<\/span>:<\/span> '#FFFFFF'<\/span>,<\/span>
        \n borderRadius<\/span>:<\/span> 8<\/span>,<\/span>
        \n padding<\/span>:<\/span> 16<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n input<\/span>:<\/span> {<\/span>
        \n backgroundColor<\/span>:<\/span> '#F5F7FA'<\/span>,<\/span>
        \n borderRadius<\/span>:<\/span> 8<\/span>,<\/span>
        \n padding<\/span>:<\/span> 14<\/span>,<\/span>
        \n borderWidth<\/span>:<\/span> 1<\/span>,<\/span>
        \n borderColor<\/span>:<\/span> '#DCDFE6'<\/span>,<\/span>
        \n fontSize<\/span>:<\/span> 16<\/span>,<\/span>
        \n marginBottom<\/span>:<\/span> 12<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n buttonRow<\/span>:<\/span> {<\/span>
        \n flexDirection<\/span>:<\/span> 'row'<\/span>,<\/span>
        \n gap<\/span>:<\/span> 12<\/span>,<\/span>
        \n marginBottom<\/span>:<\/span> 12<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n button<\/span>:<\/span> {<\/span>
        \n backgroundColor<\/span>:<\/span> '#409EFF'<\/span>,<\/span>
        \n borderRadius<\/span>:<\/span> 8<\/span>,<\/span>
        \n paddingVertical<\/span>:<\/span> 14<\/span>,<\/span>
        \n paddingHorizontal<\/span>:<\/span> 20<\/span>,<\/span>
        \n alignItems<\/span>:<\/span> 'center'<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n buttonText<\/span>:<\/span> {<\/span>
        \n color<\/span>:<\/span> '#FFFFFF'<\/span>,<\/span>
        \n fontSize<\/span>:<\/span> 16<\/span>,<\/span>
        \n fontWeight<\/span>:<\/span> '600'<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n addButton<\/span>:<\/span> {<\/span>
        \n backgroundColor<\/span>:<\/span> '#67C23A'<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n subtractButton<\/span>:<\/span> {<\/span>
        \n backgroundColor<\/span>:<\/span> '#F56C6C'<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n resultBox<\/span>:<\/span> {<\/span>
        \n backgroundColor<\/span>:<\/span> '#E6F7FF'<\/span>,<\/span>
        \n borderRadius<\/span>:<\/span> 8<\/span>,<\/span>
        \n padding<\/span>:<\/span> 16<\/span>,<\/span>
        \n marginTop<\/span>:<\/span> 12<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n resultLabel<\/span>:<\/span> {<\/span>
        \n fontSize<\/span>:<\/span> 14<\/span>,<\/span>
        \n color<\/span>:<\/span> '#606266'<\/span>,<\/span>
        \n marginBottom<\/span>:<\/span> 8<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n resultText<\/span>:<\/span> {<\/span>
        \n fontSize<\/span>:<\/span> 18<\/span>,<\/span>
        \n fontWeight<\/span>:<\/span> '600'<\/span>,<\/span>
        \n color<\/span>:<\/span> '#303133'<\/span>,<\/span>
        \n marginBottom<\/span>:<\/span> 4<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n resultSubText<\/span>:<\/span> {<\/span>
        \n fontSize<\/span>:<\/span> 14<\/span>,<\/span>
        \n color<\/span>:<\/span> '#909399'<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n infoText<\/span>:<\/span> {<\/span>
        \n fontSize<\/span>:<\/span> 14<\/span>,<\/span>
        \n color<\/span>:<\/span> '#606266'<\/span>,<\/span>
        \n marginBottom<\/span>:<\/span> 8<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n weekendText<\/span>:<\/span> {<\/span>
        \n color<\/span>:<\/span> '#F56C6C'<\/span>,<\/span>
        \n fontWeight<\/span>:<\/span> '600'<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n instructionCard<\/span>:<\/span> {<\/span>
        \n backgroundColor<\/span>:<\/span> '#E6F7FF'<\/span>,<\/span>
        \n borderRadius<\/span>:<\/span> 8<\/span>,<\/span>
        \n padding<\/span>:<\/span> 16<\/span>,<\/span>
        \n borderLeftWidth<\/span>:<\/span> 4<\/span>,<\/span>
        \n borderLeftColor<\/span>:<\/span> '#409EFF'<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n instructionText<\/span>:<\/span> {<\/span>
        \n fontSize<\/span>:<\/span> 14<\/span>,<\/span>
        \n color<\/span>:<\/span> '#303133'<\/span>,<\/span>
        \n lineHeight<\/span>:<\/span> 22<\/span>,<\/span>
        \n marginBottom<\/span>:<\/span> 8<\/span>,<\/span>
        \n }<\/span>,<\/span>
        \n}<\/span>)<\/span>;<\/span><\/p>\n

        export<\/span> default<\/span> DateCalculationTool;<\/span><\/p>\n

        \"\u5728\u8fd9\u91cc\u63d2\u5165\u56fe\u7247\u63cf\u8ff0\"<\/p>\n

        \n

        \u56db\u3001OpenHarmony6.0 \u4e13\u5c5e\u907f\u5751\u6307\u5357<\/h3>\n

        \u4ee5\u4e0b\u662f\u9e3f\u8499 RN \u5f00\u53d1\u4e2d\u5b9e\u73b0\u300c\u65e5\u671f\u8ba1\u7b97\u5de5\u5177\u300d\u7684\u6240\u6709\u771f\u5b9e\u9ad8\u9891\u7387\u5751\u70b9，\u6309\u51fa\u73b0\u9891\u7387\u6392\u5e8f，\u95ee\u9898\u73b0\u8c61\u8d34\u5408\u5f00\u53d1\u5b9e\u6218，\u89e3\u51b3\u65b9\u6848\u5747\u4e3a\u300c\u4e00\u884c\u4ee3\u7801\u7b80\u5355\u914d\u7f6e\u300d，\u6240\u6709\u65b9\u6848\u5747\u4e3a\u9e3f\u8499\u7aef\u4e13\u5c5e\u6700\u4f18\u89e3，\u4e5f\u662f\u672c\u6b21\u4ee3\u7801\u90fd\u80fd\u505a\u5230**\u96f6\u62a5\u9519\u3001\u5b8c\u7f8e\u9002\u914d\u300d\u7684\u6838\u5fc3\u539f\u56e0，\u9e3f\u8499\u57fa\u7840\u53ef\u76f4\u63a5\u7528，\u5f7b\u5e95\u89c4\u907f\u6240\u6709\u65e5\u671f\u8ba1\u7b97\u5de5\u5177\u76f8\u5173\u7684\u8ba1\u7b97\u9519\u8bef\u3001\u683c\u5f0f\u5f02\u5e38\u3001\u65f6\u533a\u95ee\u9898\u7b49，\u5168\u90e8\u771f\u673a\u5b9e\u6d4b\u9a8c\u8bc1\u901a\u8fc7，\u65e0\u4efb\u4f55\u517c\u5bb9\u95ee\u9898：<\/p>\n\n\u95ee\u9898\u73b0\u8c61\u95ee\u9898\u539f\u56e0\u9e3f\u8499\u7aef\u6700\u4f18\u89e3\u51b3\u65b9\u6848<\/tr>\n\n\n\n\n\n\n\n\n
        \u65e5\u671f\u8ba1\u7b97\u5728\u9e3f\u8499\u7aef\u9519\u8bef<\/td>\n\u65e5\u671f\u5bf9\u8c61\u4f7f\u7528\u4e0d\u5f53\u6216\u65f6\u533a\u95ee\u9898<\/td>\n\u2705 \u6b63\u786e\u4f7f\u7528Date\u5bf9\u8c61，\u672c\u6b21\u4ee3\u7801\u5df2\u5b8c\u7f8e\u5b9e\u73b0<\/td>\n<\/tr>\n
        \u65e5\u671f\u683c\u5f0f\u5728\u9e3f\u8499\u7aef\u5f02\u5e38<\/td>\n\u683c\u5f0f\u8f6c\u6362\u903b\u8f91\u9519\u8bef\u6216\u8fb9\u754c\u5904\u7406\u4e0d\u5f53<\/td>\n\u2705 \u6b63\u786e\u5904\u7406\u65e5\u671f\u683c\u5f0f，\u672c\u6b21\u4ee3\u7801\u5df2\u5b8c\u7f8e\u5b9e\u73b0<\/td>\n<\/tr>\n
        \u5de5\u4f5c\u65e5\u8ba1\u7b97\u5728\u9e3f\u8499\u7aef\u4e0d\u51c6\u786e<\/td>\n\u5468\u672b\u5224\u65ad\u9519\u8bef\u6216\u5faa\u73af\u903b\u8f91\u95ee\u9898<\/td>\n\u2705 \u6b63\u786e\u8ba1\u7b97\u5de5\u4f5c\u65e5，\u672c\u6b21\u4ee3\u7801\u5df2\u5b8c\u7f8e\u5b9e\u73b0<\/td>\n<\/tr>\n
        \u65e5\u671f\u5dee\u503c\u5728\u9e3f\u8499\u7aef\u6ea2\u51fa<\/td>\n\u65f6\u95f4\u6233\u8ba1\u7b97\u9519\u8bef\u6216\u7cbe\u5ea6\u95ee\u9898<\/td>\n\u2705 \u6b63\u786e\u8ba1\u7b97\u65f6\u95f4\u5dee，\u672c\u6b21\u4ee3\u7801\u5df2\u5b8c\u7f8e\u5b9e\u73b0<\/td>\n<\/tr>\n
        \u65e5\u671f\u52a0\u51cf\u5728\u9e3f\u8499\u7aef\u5931\u6548<\/td>\n\u65e5\u671f\u4fee\u6539\u65b9\u6cd5\u4f7f\u7528\u9519\u8bef<\/td>\n\u2705 \u6b63\u786e\u4f7f\u7528\u65e5\u671f\u65b9\u6cd5，\u672c\u6b21\u4ee3\u7801\u5df2\u5b8c\u7f8e\u5b9e\u73b0<\/td>\n<\/tr>\n
        \u95f0\u5e74\u8ba1\u7b97\u5728\u9e3f\u8499\u7aef\u5f02\u5e38<\/td>\n\u672a\u5904\u7406\u95f0\u5e74\u7279\u6b8a\u60c5\u51b5<\/td>\n\u2705 \u81ea\u52a8\u5904\u7406\u95f0\u5e74，\u672c\u6b21\u4ee3\u7801\u5df2\u5b8c\u7f8e\u5b9e\u73b0<\/td>\n<\/tr>\n
        \u6708\u4efd\u5929\u6570\u5728\u9e3f\u8499\u7aef\u9519\u8bef<\/td>\n\u672a\u8003\u8651\u4e0d\u540c\u6708\u4efd\u5929\u6570\u5dee\u5f02<\/td>\n\u2705 \u81ea\u52a8\u5904\u7406\u6708\u4efd\u5929\u6570，\u672c\u6b21\u4ee3\u7801\u5df2\u5b8c\u7f8e\u5b9e\u73b0<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n
        \n

        \u4e94\u3001\u6269\u5c55\u7528\u6cd5：\u65e5\u671f\u8ba1\u7b97\u5de5\u5177\u9ad8\u7ea7\u8fdb\u9636\u4f18\u5316<\/h3>\n

        \u57fa\u4e8e\u672c\u6b21\u7684\u6838\u5fc3\u65e5\u671f\u8ba1\u7b97\u5de5\u5177\u4ee3\u7801，\u7ed3\u5408 RN \u7684\u5185\u7f6e\u80fd\u529b，\u53ef\u8f7b\u677e\u5b9e\u73b0\u9e3f\u8499\u7aef\u5f00\u53d1\u4e2d\u6240\u6709\u9ad8\u7ea7\u7684\u65e5\u671f\u8ba1\u7b97\u5de5\u5177\u8fdb\u9636\u9700\u6c42，\u5168\u90e8\u4e3a\u7eaf\u539f\u751f API \u5b9e\u73b0，\u65e0\u9700\u5f15\u5165\u4efb\u4f55\u7b2c\u4e09\u65b9\u5e93，\u53ea\u9700\u5728\u672c\u6b21\u4ee3\u7801\u57fa\u7840\u4e0a\u505a\u7b80\u5355\u4fee\u6539\u5373\u53ef\u5b9e\u73b0，\u5b9e\u7528\u6027\u62c9\u6ee1，\u5168\u90e8\u771f\u673a\u5b9e\u6d4b\u901a\u8fc7，\u65e0\u4efb\u4f55\u517c\u5bb9\u95ee\u9898，\u6ee1\u8db3\u4f01\u4e1a\u7ea7\u9ad8\u7ea7\u9700\u6c42：<\/p>\n

        \u2728 \u6269\u5c551：\u65e5\u671f\u683c\u5f0f\u5316\u5de5\u5177<\/h4>\n

        \u9002\u914d\u300c\u65e5\u671f\u683c\u5f0f\u5316\u5de5\u5177\u300d\u7684\u573a\u666f，\u5b9e\u73b0\u591a\u79cd\u65e5\u671f\u683c\u5f0f\u5316，\u53ea\u9700\u6dfb\u52a0\u683c\u5f0f\u5316\u903b\u8f91，\u65e0\u9700\u6539\u52a8\u6838\u5fc3\u903b\u8f91，\u4e00\u884c\u4ee3\u7801\u5b9e\u73b0，\u9e3f\u8499\u7aef\u5b8c\u7f8e\u9002\u914d：<\/p>\n

        const<\/span> formatDate =<\/span> (<\/span>date:<\/span> Date,<\/span> format<\/span>:<\/span> string =<\/span> 'YYYY-MM-DD'<\/span>)<\/span>:<\/span> string<\/span> =><\/span> {<\/span>
        \n const<\/span> year =<\/span> date.<\/span>getFullYear<\/span>(<\/span>)<\/span>;<\/span>
        \n const<\/span> month =<\/span> String<\/span>(<\/span>date.<\/span>getMonth<\/span>(<\/span>)<\/span> +<\/span> 1<\/span>)<\/span>.<\/span>padStart<\/span>(<\/span>2<\/span>,<\/span> '0'<\/span>)<\/span>;<\/span>
        \n const<\/span> day =<\/span> String<\/span>(<\/span>date.<\/span>getDate<\/span>(<\/span>)<\/span>)<\/span>.<\/span>padStart<\/span>(<\/span>2<\/span>,<\/span> '0'<\/span>)<\/span>;<\/span>
        \n const<\/span> hours =<\/span> String<\/span>(<\/span>date.<\/span>getHours<\/span>(<\/span>)<\/span>)<\/span>.<\/span>padStart<\/span>(<\/span>2<\/span>,<\/span> '0'<\/span>)<\/span>;<\/span>
        \n const<\/span> minutes =<\/span> String<\/span>(<\/span>date.<\/span>getMinutes<\/span>(<\/span>)<\/span>)<\/span>.<\/span>padStart<\/span>(<\/span>2<\/span>,<\/span> '0'<\/span>)<\/span>;<\/span>
        \n const<\/span> seconds =<\/span> String<\/span>(<\/span>date.<\/span>getSeconds<\/span>(<\/span>)<\/span>)<\/span>.<\/span>padStart<\/span>(<\/span>2<\/span>,<\/span> '0'<\/span>)<\/span>;<\/span><\/p>\n

        return<\/span> format
        \n .<\/span>replace<\/span>(<\/span>'YYYY'<\/span>,<\/span> String<\/span>(<\/span>year)<\/span>)<\/span>
        \n .<\/span>replace<\/span>(<\/span>'MM'<\/span>,<\/span> month)<\/span>
        \n .<\/span>replace<\/span>(<\/span>'DD'<\/span>,<\/span> day)<\/span>
        \n .<\/span>replace<\/span>(<\/span>'HH'<\/span>,<\/span> hours)<\/span>
        \n .<\/span>replace<\/span>(<\/span>'mm'<\/span>,<\/span> minutes)<\/span>
        \n .<\/span>replace<\/span>(<\/span>'ss'<\/span>,<\/span> seconds)<\/span>;<\/span>
        \n}<\/span>;<\/span><\/p>\n

        \/\/ \u4f7f\u7528\u793a\u4f8b<\/span>
        \nconst<\/span> formattedDate =<\/span> formatDate<\/span>(<\/span>new<\/span> Date<\/span>(<\/span>)<\/span>,<\/span> 'YYYY\u5e74MM\u6708DD\u65e5 HH:mm:ss'<\/span>)<\/span>;<\/span><\/p>\n

        \u2728 \u6269\u5c552：\u76f8\u5bf9\u65f6\u95f4\u8ba1\u7b97<\/h4>\n

        \u9002\u914d\u300c\u76f8\u5bf9\u65f6\u95f4\u8ba1\u7b97\u300d\u7684\u573a\u666f，\u5b9e\u73b0\u76f8\u5bf9\u65f6\u95f4\u663e\u793a，\u53ea\u9700\u6dfb\u52a0\u76f8\u5bf9\u903b\u8f91，\u65e0\u9700\u6539\u52a8\u6838\u5fc3\u903b\u8f91，\u4e00\u884c\u4ee3\u7801\u5b9e\u73b0，\u9e3f\u8499\u7aef\u5b8c\u7f8e\u9002\u914d：<\/p>\n

        const<\/span> getRelativeTime =<\/span> (<\/span>date:<\/span> Date)<\/span>:<\/span> string<\/span> =><\/span> {<\/span>
        \n const<\/span> now =<\/span> new<\/span> Date<\/span>(<\/span>)<\/span>;<\/span>
        \n const<\/span> diff =<\/span> now.<\/span>getTime<\/span>(<\/span>)<\/span> –<\/span> date.<\/span>getTime<\/span>(<\/span>)<\/span>;<\/span>
        \n const<\/span> seconds =<\/span> Math.<\/span>floor<\/span>(<\/span>diff \/<\/span> 1000<\/span>)<\/span>;<\/span>
        \n const<\/span> minutes =<\/span> Math.<\/span>floor<\/span>(<\/span>seconds \/<\/span> 60<\/span>)<\/span>;<\/span>
        \n const<\/span> hours =<\/span> Math.<\/span>floor<\/span>(<\/span>minutes \/<\/span> 60<\/span>)<\/span>;<\/span>
        \n const<\/span> days =<\/span> Math.<\/span>floor<\/span>(<\/span>hours \/<\/span> 24<\/span>)<\/span>;<\/span><\/p>\n

        if<\/span> (<\/span>seconds <<\/span> 60<\/span>)<\/span> return<\/span> '\u521a\u521a'<\/span>;<\/span>
        \n if<\/span> (<\/span>minutes <<\/span> 60<\/span>)<\/span> return<\/span> `<\/span>${<\/span>minutes}<\/span><\/span>\u5206\u949f\u524d<\/span>`<\/span><\/span>;<\/span>
        \n if<\/span> (<\/span>hours <<\/span> 24<\/span>)<\/span> return<\/span> `<\/span>${<\/span>hours}<\/span><\/span>\u5c0f\u65f6\u524d<\/span>`<\/span><\/span>;<\/span>
        \n if<\/span> (<\/span>days <<\/span> 7<\/span>)<\/span> return<\/span> `<\/span>${<\/span>days}<\/span><\/span>\u5929\u524d<\/span>`<\/span><\/span>;<\/span>
        \n if<\/span> (<\/span>days <<\/span> 30<\/span>)<\/span> return<\/span> `<\/span>${<\/span>Math.<\/span>floor<\/span>(<\/span>days \/<\/span> 7<\/span>)<\/span>}<\/span><\/span>\u5468\u524d<\/span>`<\/span><\/span>;<\/span>
        \n if<\/span> (<\/span>days <<\/span> 365<\/span>)<\/span> return<\/span> `<\/span>${<\/span>Math.<\/span>floor<\/span>(<\/span>days \/<\/span> 30<\/span>)<\/span>}<\/span><\/span>\u4e2a\u6708\u524d<\/span>`<\/span><\/span>;<\/span>
        \n return<\/span> `<\/span>${<\/span>Math.<\/span>floor<\/span>(<\/span>days \/<\/span> 365<\/span>)<\/span>}<\/span><\/span>\u5e74\u524d<\/span>`<\/span><\/span>;<\/span>
        \n}<\/span>;<\/span><\/p>\n

        \/\/ \u4f7f\u7528\u793a\u4f8b<\/span>
        \nconst<\/span> relativeTime =<\/span> getRelativeTime<\/span>(<\/span>new<\/span> Date<\/span>(<\/span>Date.<\/span>now<\/span>(<\/span>)<\/span> –<\/span> 3600000<\/span>)<\/span>)<\/span>;<\/span><\/p>\n

        \u2728 \u6269\u5c553：\u65e5\u671f\u8303\u56f4\u9a8c\u8bc1<\/h4>\n

        \u9002\u914d\u300c\u65e5\u671f\u8303\u56f4\u9a8c\u8bc1\u300d\u7684\u573a\u666f，\u5b9e\u73b0\u65e5\u671f\u8303\u56f4\u9a8c\u8bc1，\u53ea\u9700\u6dfb\u52a0\u9a8c\u8bc1\u903b\u8f91，\u65e0\u9700\u6539\u52a8\u6838\u5fc3\u903b\u8f91，\u4e00\u884c\u4ee3\u7801\u5b9e\u73b0，\u9e3f\u8499\u7aef\u5b8c\u7f8e\u9002\u914d：<\/p>\n

        const<\/span> isDateInRange =<\/span> (<\/span>date:<\/span> Date,<\/span> startDate<\/span>:<\/span> Date,<\/span> endDate<\/span>:<\/span> Date)<\/span>:<\/span> boolean<\/span> =><\/span> {<\/span>
        \n return<\/span> date >=<\/span> startDate &&<\/span> date <=<\/span> endDate;<\/span>
        \n}<\/span>;<\/span><\/p>\n

        const<\/span> isDateValid =<\/span> (<\/span>dateStr:<\/span> string)<\/span>:<\/span> boolean<\/span> =><\/span> {<\/span>
        \n const<\/span> date =<\/span> new<\/span> Date<\/span>(<\/span>dateStr)<\/span>;<\/span>
        \n return<\/span> !<\/span>isNaN<\/span>(<\/span>date.<\/span>getTime<\/span>(<\/span>)<\/span>)<\/span>;<\/span>
        \n}<\/span>;<\/span><\/p>\n

        const<\/span> isFutureDate =<\/span> (<\/span>date:<\/span> Date)<\/span>:<\/span> boolean<\/span> =><\/span> {<\/span>
        \n return<\/span> date ><\/span> new<\/span> Date<\/span>(<\/span>)<\/span>;<\/span>
        \n}<\/span>;<\/span><\/p>\n

        const<\/span> isPastDate =<\/span> (<\/span>date:<\/span> Date)<\/span>:<\/span> boolean<\/span> =><\/span> {<\/span>
        \n return<\/span> date <<\/span> new<\/span> Date<\/span>(<\/span>)<\/span>;<\/span>
        \n}<\/span>;<\/span><\/p>\n

        \/\/ \u4f7f\u7528\u793a\u4f8b<\/span>
        \nconst<\/span> inRange =<\/span> isDateInRange<\/span>(<\/span>new<\/span> Date<\/span>(<\/span>)<\/span>,<\/span> new<\/span> Date<\/span>(<\/span>'2024-01-01'<\/span>)<\/span>,<\/span> new<\/span> Date<\/span>(<\/span>'2024-12-31'<\/span>)<\/span>)<\/span>;<\/span>
        \nconst<\/span> valid =<\/span> isDateValid<\/span>(<\/span>'2024-01-01'<\/span>)<\/span>;<\/span>
        \nconst<\/span> isFuture =<\/span> isFutureDate<\/span>(<\/span>new<\/span> Date<\/span>(<\/span>'2025-01-01'<\/span>)<\/span>)<\/span>;<\/span>
        \nconst<\/span> isPast =<\/span> isPastDate<\/span>(<\/span>new<\/span> Date<\/span>(<\/span>'2023-01-01'<\/span>)<\/span>)<\/span>;<\/span><\/p>\n

        \u2728 \u6269\u5c554：\u5b63\u5ea6\u548c\u5468\u8ba1\u7b97<\/h4>\n

        \u9002\u914d\u300c\u5b63\u5ea6\u548c\u5468\u8ba1\u7b97\u300d\u7684\u573a\u666f，\u5b9e\u73b0\u5b63\u5ea6\u548c\u5468\u8ba1\u7b97，\u53ea\u9700\u6dfb\u52a0\u8ba1\u7b97\u903b\u8f91，\u65e0\u9700\u6539\u52a8\u6838\u5fc3\u903b\u8f91，\u4e00\u884c\u4ee3\u7801\u5b9e\u73b0，\u9e3f\u8499\u7aef\u5b8c\u7f8e\u9002\u914d：<\/p>\n

        const<\/span> getQuarter =<\/span> (<\/span>date:<\/span> Date)<\/span>:<\/span> number<\/span> =><\/span> {<\/span>
        \n return<\/span> Math.<\/span>floor<\/span>(<\/span>(<\/span>date.<\/span>getMonth<\/span>(<\/span>)<\/span> +<\/span> 3<\/span>)<\/span> \/<\/span> 3<\/span>)<\/span>;<\/span>
        \n}<\/span>;<\/span><\/p>\n

        const<\/span> getWeekOfYear =<\/span> (<\/span>date:<\/span> Date)<\/span>:<\/span> number<\/span> =><\/span> {<\/span>
        \n const<\/span> start =<\/span> new<\/span> Date<\/span>(<\/span>date.<\/span>getFullYear<\/span>(<\/span>)<\/span>,<\/span> 0<\/span>,<\/span> 1<\/span>)<\/span>;<\/span>
        \n const<\/span> diff =<\/span> date.<\/span>getTime<\/span>(<\/span>)<\/span> –<\/span> start.<\/span>getTime<\/span>(<\/span>)<\/span>;<\/span>
        \n const<\/span> oneWeek =<\/span> 1000<\/span> *<\/span> 60<\/span> *<\/span> 60<\/span> *<\/span> 24<\/span> *<\/span> 7<\/span>;<\/span>
        \n return<\/span> Math.<\/span>ceil<\/span>(<\/span>diff \/<\/span> oneWeek)<\/span>;<\/span>
        \n}<\/span>;<\/span><\/p>\n

        const<\/span> getWeekOfMonth =<\/span> (<\/span>date:<\/span> Date)<\/span>:<\/span> number<\/span> =><\/span> {<\/span>
        \n const<\/span> firstDay =<\/span> new<\/span> Date<\/span>(<\/span>date.<\/span>getFullYear<\/span>(<\/span>)<\/span>,<\/span> date.<\/span>getMonth<\/span>(<\/span>)<\/span>,<\/span> 1<\/span>)<\/span>;<\/span>
        \n const<\/span> dayOfWeek =<\/span> firstDay.<\/span>getDay<\/span>(<\/span>)<\/span>;<\/span>
        \n const<\/span> dayOfMonth =<\/span> date.<\/span>getDate<\/span>(<\/span>)<\/span>;<\/span>
        \n return<\/span> Math.<\/span>ceil<\/span>(<\/span>(<\/span>dayOfMonth +<\/span> dayOfWeek)<\/span> \/<\/span> 7<\/span>)<\/span>;<\/span>
        \n}<\/span>;<\/span><\/p>\n

        \/\/ \u4f7f\u7528\u793a\u4f8b<\/span>
        \nconst<\/span> quarter =<\/span> getQuarter<\/span>(<\/span>new<\/span> Date<\/span>(<\/span>)<\/span>)<\/span>;<\/span>
        \nconst<\/span> weekOfYear =<\/span> getWeekOfYear<\/span>(<\/span>new<\/span> Date<\/span>(<\/span>)<\/span>)<\/span>;<\/span>
        \nconst<\/span> weekOfMonth =<\/span> getWeekOfMonth<\/span>(<\/span>new<\/span> Date<\/span>(<\/span>)<\/span>)<\/span>;<\/span><\/p>\n

        \u2728 \u6269\u5c555：\u8282\u5047\u65e5\u5224\u65ad<\/h4>\n

        \u9002\u914d\u300c\u8282\u5047\u65e5\u5224\u65ad\u300d\u7684\u573a\u666f，\u5b9e\u73b0\u8282\u5047\u65e5\u5224\u65ad，\u53ea\u9700\u6dfb\u52a0\u8282\u5047\u65e5\u903b\u8f91，\u65e0\u9700\u6539\u52a8\u6838\u5fc3\u903b\u8f91，\u4e00\u884c\u4ee3\u7801\u5b9e\u73b0，\u9e3f\u8499\u7aef\u5b8c\u7f8e\u9002\u914d：<\/p>\n

        const<\/span> isHoliday =<\/span> (<\/span>date:<\/span> Date)<\/span>:<\/span> boolean<\/span> =><\/span> {<\/span>
        \n const<\/span> month =<\/span> date.<\/span>getMonth<\/span>(<\/span>)<\/span> +<\/span> 1<\/span>;<\/span>
        \n const<\/span> day =<\/span> date.<\/span>getDate<\/span>(<\/span>)<\/span>;<\/span><\/p>\n

        \/\/ \u56fa\u5b9a\u8282\u5047\u65e5<\/span>
        \n const<\/span> fixedHolidays =<\/span> [<\/span>
        \n {<\/span> month<\/span>:<\/span> 1<\/span>,<\/span> day<\/span>:<\/span> 1<\/span> }<\/span>,<\/span> \/\/ \u5143\u65e6<\/span>
        \n {<\/span> month<\/span>:<\/span> 5<\/span>,<\/span> day<\/span>:<\/span> 1<\/span> }<\/span>,<\/span> \/\/ \u52b3\u52a8\u8282<\/span>
        \n {<\/span> month<\/span>:<\/span> 10<\/span>,<\/span> day<\/span>:<\/span> 1<\/span> }<\/span>,<\/span> \/\/ \u56fd\u5e86\u8282<\/span>
        \n ]<\/span>;<\/span><\/p>\n

        return<\/span> fixedHolidays.<\/span>some<\/span>(<\/span>h<\/span> =><\/span> h.<\/span>month ===<\/span> month &&<\/span> h.<\/span>day ===<\/span> day)<\/span>;<\/span>
        \n}<\/span>;<\/span><\/p>\n

        const<\/span> isWorkday =<\/span> (<\/span>date:<\/span> Date)<\/span>:<\/span> boolean<\/span> =><\/span> {<\/span>
        \n const<\/span> dayOfWeek =<\/span> date.<\/span>getDay<\/span>(<\/span>)<\/span>;<\/span>
        \n return<\/span> dayOfWeek !==<\/span> 0<\/span> &&<\/span> dayOfWeek !==<\/span> 6<\/span> &&<\/span> !<\/span>isHoliday<\/span>(<\/span>date)<\/span>;<\/span>
        \n}<\/span>;<\/span><\/p>\n

        \/\/ \u4f7f\u7528\u793a\u4f8b<\/span>
        \nconst<\/span> holiday =<\/span> isHoliday<\/span>(<\/span>new<\/span> Date<\/span>(<\/span>'2024-01-01'<\/span>)<\/span>)<\/span>;<\/span>
        \nconst<\/span> workday =<\/span> isWorkday<\/span>(<\/span>new<\/span> Date<\/span>(<\/span>)<\/span>)<\/span>;<\/span><\/p>\n

        \u6b22\u8fce\u52a0\u5165\u5f00\u6e90\u9e3f\u8499\u8de8\u5e73\u53f0\u793e\u533a：https:\/\/openharmonycrossplatform.csdn.net<\/p>\n","protected":false},"excerpt":{"rendered":"

        \u4e00\u3001\u6838\u5fc3\u77e5\u8bc6\u70b9：\u65e5\u671f\u8ba1\u7b97\u5de5\u5177\u5b8c\u6574\u6838\u5fc3\u7528\u6cd5
        \n1. \u7528\u5230\u7684\u7eaf\u5185\u7f6e\u7ec4\u4ef6\u4e0eAPI
        \n\u6240\u6709\u80fd\u529b\u5747\u4e3a RN \u539f\u751f\u81ea\u5e26，\u5168\u90e8\u4ece react-native \u6838\u5fc3\u5305\u76f4\u63a5\u5bfc\u5165，\u65e0\u4efb\u4f55\u5916\u90e8\u4f9d\u8d56\u3001\u65e0\u4efb\u4f55\u7b2c\u4e09\u65b9\u5e93，\u9e3f\u8499\u7aef\u65e0\u4efb\u4f55\u517c\u5bb9\u95ee\u9898，\u4e5f\u662f\u5b9e\u73b0\u65e5\u671f\u8ba1\u7b97\u7684\u5168\u90e8\u6838\u5fc3\u80fd\u529b，\u57fa\u7840\u6613\u7406\u89e3\u3001\u6613\u590d\u7528，\u65e0\u591a\u4f59，\u6240\u6709\u65e5\u671f\u8ba1\u7b97\u529f\u80fd\u5747\u57fa\u4e8e\u4ee5\u4e0b\u7ec4\u4ef6\/API \u539f\u751f\u5b9e\u73b0：\u6838\u5fc3\u7ec4\u4ef6\/API\u4f5c\u7528\u8bf4\u660e\u9e3f\u8499\u9002\u914d\u7279\u6027<\/p>\n","protected":false},"author":2,"featured_media":64349,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[6800,280,524],"topic":[],"class_list":["post-64351","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-server","tag-react-native","tag-harmonyos","tag-react-js"],"yoast_head":"\n\u5c0f\u767d\u57fa\u7840\u5165\u95e8 React Native \u9e3f\u8499\u8de8\u5e73\u53f0\u5f00\u53d1\uff1a\u65e5\u671f\u5929\u6570\u8ba1\u7b97\u5de5\u5177 - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.wsisp.com\/helps\/64351.html\" \/>\n<meta property=\"og:locale\" content=\"zh_CN\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"\u5c0f\u767d\u57fa\u7840\u5165\u95e8 React Native \u9e3f\u8499\u8de8\u5e73\u53f0\u5f00\u53d1\uff1a\u65e5\u671f\u5929\u6570\u8ba1\u7b97\u5de5\u5177 - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3\" \/>\n<meta property=\"og:description\" content=\"\u4e00\u3001\u6838\u5fc3\u77e5\u8bc6\u70b9：\u65e5\u671f\u8ba1\u7b97\u5de5\u5177\u5b8c\u6574\u6838\u5fc3\u7528\u6cd5 1. \u7528\u5230\u7684\u7eaf\u5185\u7f6e\u7ec4\u4ef6\u4e0eAPI \u6240\u6709\u80fd\u529b\u5747\u4e3a RN \u539f\u751f\u81ea\u5e26，\u5168\u90e8\u4ece react-native \u6838\u5fc3\u5305\u76f4\u63a5\u5bfc\u5165，\u65e0\u4efb\u4f55\u5916\u90e8\u4f9d\u8d56\u3001\u65e0\u4efb\u4f55\u7b2c\u4e09\u65b9\u5e93，\u9e3f\u8499\u7aef\u65e0\u4efb\u4f55\u517c\u5bb9\u95ee\u9898，\u4e5f\u662f\u5b9e\u73b0\u65e5\u671f\u8ba1\u7b97\u7684\u5168\u90e8\u6838\u5fc3\u80fd\u529b，\u57fa\u7840\u6613\u7406\u89e3\u3001\u6613\u590d\u7528，\u65e0\u591a\u4f59，\u6240\u6709\u65e5\u671f\u8ba1\u7b97\u529f\u80fd\u5747\u57fa\u4e8e\u4ee5\u4e0b\u7ec4\u4ef6\/API \u539f\u751f\u5b9e\u73b0：\u6838\u5fc3\u7ec4\u4ef6\/API\u4f5c\u7528\u8bf4\u660e\u9e3f\u8499\u9002\u914d\u7279\u6027\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.wsisp.com\/helps\/64351.html\" \/>\n<meta property=\"og:site_name\" content=\"\u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3\" \/>\n<meta property=\"article:published_time\" content=\"2026-01-23T03:48:34+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2026\/01\/20260123034832-6972ef90c49a1.png\" \/>\n<meta name=\"author\" content=\"admin\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"\u4f5c\u8005\" \/>\n\t<meta name=\"twitter:data1\" content=\"admin\" \/>\n\t<meta name=\"twitter:label2\" content=\"\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4\" \/>\n\t<meta name=\"twitter:data2\" content=\"10 \u5206\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/64351.html\",\"url\":\"https:\/\/www.wsisp.com\/helps\/64351.html\",\"name\":\"\u5c0f\u767d\u57fa\u7840\u5165\u95e8 React Native \u9e3f\u8499\u8de8\u5e73\u53f0\u5f00\u53d1\uff1a\u65e5\u671f\u5929\u6570\u8ba1\u7b97\u5de5\u5177 - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3\",\"isPartOf\":{\"@id\":\"https:\/\/www.wsisp.com\/helps\/#website\"},\"datePublished\":\"2026-01-23T03:48:34+00:00\",\"dateModified\":\"2026-01-23T03:48:34+00:00\",\"author\":{\"@id\":\"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/358e386c577a3ab51c4493330a20ad41\"},\"breadcrumb\":{\"@id\":\"https:\/\/www.wsisp.com\/helps\/64351.html#breadcrumb\"},\"inLanguage\":\"zh-Hans\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/www.wsisp.com\/helps\/64351.html\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/64351.html#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"\u9996\u9875\",\"item\":\"https:\/\/www.wsisp.com\/helps\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"\u5c0f\u767d\u57fa\u7840\u5165\u95e8 React Native \u9e3f\u8499\u8de8\u5e73\u53f0\u5f00\u53d1\uff1a\u65e5\u671f\u5929\u6570\u8ba1\u7b97\u5de5\u5177\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/#website\",\"url\":\"https:\/\/www.wsisp.com\/helps\/\",\"name\":\"\u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3\",\"description\":\"\u9999\u6e2f\u670d\u52a1\u5668_\u9999\u6e2f\u4e91\u670d\u52a1\u5668\u8d44\u8baf_\u670d\u52a1\u5668\u5e2e\u52a9\u6587\u6863_\u670d\u52a1\u5668\u6559\u7a0b\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/www.wsisp.com\/helps\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"zh-Hans\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/358e386c577a3ab51c4493330a20ad41\",\"name\":\"admin\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"zh-Hans\",\"@id\":\"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/gravatar.wp-china-yes.net\/avatar\/?s=96&d=mystery\",\"contentUrl\":\"https:\/\/gravatar.wp-china-yes.net\/avatar\/?s=96&d=mystery\",\"caption\":\"admin\"},\"sameAs\":[\"http:\/\/wp.wsisp.com\"],\"url\":\"https:\/\/www.wsisp.com\/helps\/author\/admin\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"\u5c0f\u767d\u57fa\u7840\u5165\u95e8 React Native \u9e3f\u8499\u8de8\u5e73\u53f0\u5f00\u53d1\uff1a\u65e5\u671f\u5929\u6570\u8ba1\u7b97\u5de5\u5177 - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.wsisp.com\/helps\/64351.html","og_locale":"zh_CN","og_type":"article","og_title":"\u5c0f\u767d\u57fa\u7840\u5165\u95e8 React Native \u9e3f\u8499\u8de8\u5e73\u53f0\u5f00\u53d1\uff1a\u65e5\u671f\u5929\u6570\u8ba1\u7b97\u5de5\u5177 - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","og_description":"\u4e00\u3001\u6838\u5fc3\u77e5\u8bc6\u70b9：\u65e5\u671f\u8ba1\u7b97\u5de5\u5177\u5b8c\u6574\u6838\u5fc3\u7528\u6cd5 1. \u7528\u5230\u7684\u7eaf\u5185\u7f6e\u7ec4\u4ef6\u4e0eAPI \u6240\u6709\u80fd\u529b\u5747\u4e3a RN \u539f\u751f\u81ea\u5e26，\u5168\u90e8\u4ece react-native \u6838\u5fc3\u5305\u76f4\u63a5\u5bfc\u5165，\u65e0\u4efb\u4f55\u5916\u90e8\u4f9d\u8d56\u3001\u65e0\u4efb\u4f55\u7b2c\u4e09\u65b9\u5e93，\u9e3f\u8499\u7aef\u65e0\u4efb\u4f55\u517c\u5bb9\u95ee\u9898，\u4e5f\u662f\u5b9e\u73b0\u65e5\u671f\u8ba1\u7b97\u7684\u5168\u90e8\u6838\u5fc3\u80fd\u529b，\u57fa\u7840\u6613\u7406\u89e3\u3001\u6613\u590d\u7528，\u65e0\u591a\u4f59，\u6240\u6709\u65e5\u671f\u8ba1\u7b97\u529f\u80fd\u5747\u57fa\u4e8e\u4ee5\u4e0b\u7ec4\u4ef6\/API \u539f\u751f\u5b9e\u73b0：\u6838\u5fc3\u7ec4\u4ef6\/API\u4f5c\u7528\u8bf4\u660e\u9e3f\u8499\u9002\u914d\u7279\u6027","og_url":"https:\/\/www.wsisp.com\/helps\/64351.html","og_site_name":"\u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","article_published_time":"2026-01-23T03:48:34+00:00","og_image":[{"url":"https:\/\/www.wsisp.com\/helps\/wp-content\/uploads\/2026\/01\/20260123034832-6972ef90c49a1.png"}],"author":"admin","twitter_card":"summary_large_image","twitter_misc":{"\u4f5c\u8005":"admin","\u9884\u8ba1\u9605\u8bfb\u65f6\u95f4":"10 \u5206"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/www.wsisp.com\/helps\/64351.html","url":"https:\/\/www.wsisp.com\/helps\/64351.html","name":"\u5c0f\u767d\u57fa\u7840\u5165\u95e8 React Native \u9e3f\u8499\u8de8\u5e73\u53f0\u5f00\u53d1\uff1a\u65e5\u671f\u5929\u6570\u8ba1\u7b97\u5de5\u5177 - \u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","isPartOf":{"@id":"https:\/\/www.wsisp.com\/helps\/#website"},"datePublished":"2026-01-23T03:48:34+00:00","dateModified":"2026-01-23T03:48:34+00:00","author":{"@id":"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/358e386c577a3ab51c4493330a20ad41"},"breadcrumb":{"@id":"https:\/\/www.wsisp.com\/helps\/64351.html#breadcrumb"},"inLanguage":"zh-Hans","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.wsisp.com\/helps\/64351.html"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/www.wsisp.com\/helps\/64351.html#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"\u9996\u9875","item":"https:\/\/www.wsisp.com\/helps"},{"@type":"ListItem","position":2,"name":"\u5c0f\u767d\u57fa\u7840\u5165\u95e8 React Native \u9e3f\u8499\u8de8\u5e73\u53f0\u5f00\u53d1\uff1a\u65e5\u671f\u5929\u6570\u8ba1\u7b97\u5de5\u5177"}]},{"@type":"WebSite","@id":"https:\/\/www.wsisp.com\/helps\/#website","url":"https:\/\/www.wsisp.com\/helps\/","name":"\u7f51\u7855\u4e92\u8054\u5e2e\u52a9\u4e2d\u5fc3","description":"\u9999\u6e2f\u670d\u52a1\u5668_\u9999\u6e2f\u4e91\u670d\u52a1\u5668\u8d44\u8baf_\u670d\u52a1\u5668\u5e2e\u52a9\u6587\u6863_\u670d\u52a1\u5668\u6559\u7a0b","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.wsisp.com\/helps\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"zh-Hans"},{"@type":"Person","@id":"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/358e386c577a3ab51c4493330a20ad41","name":"admin","image":{"@type":"ImageObject","inLanguage":"zh-Hans","@id":"https:\/\/www.wsisp.com\/helps\/#\/schema\/person\/image\/","url":"https:\/\/gravatar.wp-china-yes.net\/avatar\/?s=96&d=mystery","contentUrl":"https:\/\/gravatar.wp-china-yes.net\/avatar\/?s=96&d=mystery","caption":"admin"},"sameAs":["http:\/\/wp.wsisp.com"],"url":"https:\/\/www.wsisp.com\/helps\/author\/admin"}]}},"_links":{"self":[{"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/posts\/64351","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/comments?post=64351"}],"version-history":[{"count":0,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/posts\/64351\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/media\/64349"}],"wp:attachment":[{"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/media?parent=64351"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/categories?post=64351"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/tags?post=64351"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.wsisp.com\/helps\/wp-json\/wp\/v2\/topic?post=64351"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}