Javascript 在React Redux应用程序中，在何处放置实用程序函数？

在React Redux应用程序中，我的状态如下：

state = {
    items: [
        { id: 1, first_name: "John", last_name: "Smith", country: "us" },
        { id: 2, first_name: "Jinping", last_name: "Xi", country: "cn" },
    ]
}

我使用React组件渲染它

现在我需要一个函数，它可以给我一个人的“全名”。因此，这不仅仅是“姓氏+姓氏”，而是取决于国家（例如，在中国是“姓氏+姓氏”），因此有一些相对复杂的逻辑，我想将其封装在一个可以从任何React组件使用的函数中

在OOP中，我将创建一个

Person:：getFullName（）

方法来提供这些信息。但是，

状态

对象是一个“哑”对象，其中子对象没有任何专门的方法

---

那么，在React Redux中，通常推荐的管理方法是什么？我所能想到的就是创建一个全局函数，比如

user\u getFullName（user）

，它将接受一个用户并返回全名，但这不是很优雅。有什么建议吗？

我遵循在我的应用程序中为此类案例创建库的方法，到目前为止，这对我来说非常有效

在这种情况下，我将创建一个新模块，例如

{ComponentRoot}/lib/user.js

，根据具体情况导出函数

getFullName（user）

，或者可能导出

getFullName（firstName，lastName，country）

现在只需导入需要功能的模块，无需全局功能：

import React from 'react'
import {getFullName} from '../lib/user'

const Title = ({user}) =>
    <div>
        {getFullName(user)}
    </div>

从“React”导入React
从“../lib/user”导入{getFullName}
常量标题=（{user}）=>
{getFullName（用户）}

---

我们将库文件夹放在与components文件夹等相同的级别上，但任何最适合您的都应该这样做。

首先。 一些著名的样板项目将代码放入

utils/

文件夹：

文件夹结构示例：

• src/
  • 组成部分/
  • 还原剂/
  • utils/