在 React Native 中如何复用函数？

Question

我需要在 React Native 中从另一个页面访问函数。

示例：

validateEmail = (email) => {
// ---- Code ----
}

我需要在 login.js 和 registration.js 中访问该功能

Answer 1

在应用程序根目录创建一个名为 Common.js 的文件，并在 common.js 文件中添加：

'use strict';

class Common {

    //here you can use your validation email code

}

module.exports = Common;

现在随时随地访问此 class。

Answer 2

对于我在评论中写的第一个问题，你可以使用这个：

如果你想导出很多函数，你可以使用这个：

您可以对样式、字体、颜色等其他内容使用相同的技术。

这些问题是重复的，因此我在此处添加链接。

Answer 3

我可以给你一个我在当前项目中使用的简单示例。

您可以按照以下步骤操作：

1.Create 一个 /utils 文件夹，您可以在其中放置所有共享函数文件，例如 datetimeHelper.js

const dateTimeHelper = {
  getFormattedDatetime: (datetime) => {
    return moment.utc(datetime).local().format('MMM Do, YYYY, h:mm a');
  }
}

export default datetimeHelper;

2.Import将文件放到你需要的地方：

import datetimeHelper from './utils/datetimeHelper.js';

3 您可以调用函数：

datetimeHelper.getFormattedDatetime(MY_DATETIME);

Answer 4

我创建了如下可重复使用的函数：

Helper.js import { Platform, Dimensions } from "react-native";

function isIphoneWithNotch() {
    const dimen = Dimensions.get("window");
    return (
        Platform.OS === 'ios' &&
        !Platform.isPad &&
        !Platform.isTVOS &&
        (
            dimen.height === 780 ||
            dimen.width === 780 ||
            dimen.height === 812 ||
            dimen.width === 812 ||
            dimen.height === 844 ||
            dimen.width === 844 ||
            dimen.height === 896 ||
            dimen.width === 896 ||
            dimen.height === 926 ||
            dimen.width === 926)
    );
}

export { isIphoneWithNotch };

使用这个函数：

import { isIphoneWithNotch } from "./Helper";

console.log(isIphoneWithNotch());

在 React Native 中如何复用函数？

In react native how to reuse functions?

react-native

react-native-android

react-native-ios