小编RTW*_*RTW的帖子

有没有办法使用新的react hooks API替换上下文数据获取？

如果需要加载用户配置文件并在几乎所有地方使用它，请首先创建上下文并导出它：

export const ProfileContext = React.createContext()

然后导入顶级组件，加载数据并使用提供程序，如下所示：

import { ProfileContext } from 'src/shared/ProfileContext'

<ProfileContext.Provider
      value={{ profile: profile, reloadProfile: reloadProfile }}
    >
        <Site />
    </ProfileContext.Provider>

然后，在其他一些组件中，您可以像这样导入配置文件数据：

import { ProfileContext } from 'src/shared/ProfileContext'
const context = useContext(profile);

但是，有一种方法可以导出带有挂钩的某些函数，这些挂钩将具有状态并与想要获取数据的任何组件共享配置文件？

更新。

我有两个文件夹前端和共享，它们被 webpack 使用 ts-loader 捆绑在一起。

问题是未检测到共享文件夹中导出接口的更改。

如果我添加 IThemes.ts 导出

export const x = 2

即使对于界面更改，也会再次检测到更改。

导出的 IThemes.ts 示例：

export interface IGeneralTheme {
  isDay: boolean
  day: ITheme
  night: ITheme
}

接口使用 ThemeContext.tsx 的示例：

import React, { useState, useEffect } from 'react'
import { deepClone, ITheme, IGeneralTheme } from '@shared'
import { ThemeProvider, createGlobalStyle } from 'styled-components'

type ThemeContextProps = {
  theme: ITheme
  generalTheme: IGeneralTheme
  isDay: boolean
  setGeneralTheme: React.Dispatch<React.SetStateAction<IGeneralTheme>>
}

export const ThemeContext = React.createContext<Partial<ThemeContextProps>>({})

tsconfig.base.json：

{
  "compilerOptions": { …

如何使用扩展进行输入检查，使通用 ApiResBook 类型与可选道具一起使用？

沙盒。

我有这样的主要类型，与数据库字段相同：

// Main types as in database - should't be changed
type Book = {
  id: string
  title: string
  visible: boolean
  author: string
}

type Author = {
  id: string
  name: string
}

对于 api 获取响应，我需要通用类型，该类型将根据请求的字段塑造对象

// Inhereted from types from main
type BookFields = keyof Book
type AuthorFields = keyof Author

// type for generating expected fetch response from API
type ApiResBook<
  PickedBookFields extends BookFields,
  PickedAuthorFields extends AuthorFields | undefined = undefined,
> = …

在反应中分享一些全球价值和职能的最佳方法是什么？

现在我有一个ContextProvider，里面都有它们：

<AllContext.Provider
  value={{
    setProfile, // second function that changes profile object using useState to false or updated value
    profileReload, // function that triggers fetch profile object from server
    deviceTheme, // object
    setDeviceTheme, // second function that changes theme object using useState to false or updated value
    clickEvent, // click event
    usePopup, // second function of useState that trigers some popup
    popup, // Just pass this to usePopup component
    windowSize, // manyUpdates on resize (like 30 a sec, but maybe …

我需要对用户输入实现标签搜索，但输入速度很快，我不想为用户输入的每个符号触发 DB 调用，所以我很好奇，有没有一种简单的好方法来消除 api 调用，让我们说 - 一个延迟 3 秒后的时间？

现在我想出了这个：

  let searchDelay
  async function handleTagSearch(e) {
    clearTimeout(searchDelay)

    tagSearchPhraseSet(e.target.value)

    searchDelay = setTimeout(async () => {
      if (e.target.value.length > 3) {
        let res = await fetch('api/tag_seatch/' + e.target.value)
        res = await res.json() 

        console.log(res)
      }
    }, 3000)
  }

但这是一个正确的方法吗？

传递具有相同名称的道具时，是否可以使用es6速记形式？

const [showNavMenu, setShowNavMenu] = useState(false)

所以这：

<NavMenu showNavMenu={showNavMenu} setShowNavMenu={setShowNavMenu} />

会变成这样：

<NavMenu {showNavMenu} {setShowNavMenu} />

这个查询没有结果的原因是什么：

SELECT name FROM users WHERE LOWER(name) LIKE LOWER('%?????%');

当这工作正常时：

SELECT name FROM users WHERE LOWER(name) LIKE LOWER('%?????%');

名字是 '？？？？？？？？？？？？？'。如果我使用“发布”之类的名称，则搜索工作正常。

版本：PostgreSQL 11.2 (Ubuntu 11.2-100) on x86_64-pc-linux-gnu，由 gcc 编译 (Ubuntu 7.3.0-27ubuntu1~18.04) 7.3.0, 64-bit

服务器和数据库编码为 UTF8。客户端编码是 UNICODE。

due_date如果我使用为可为空的时间戳列创建索引DESC NULLS LAST，那么索引也适用于ASC NULLS LAST查询吗？

也许它的性能会降低？或者我需要创建第二个索引？

在 postgres文档中，我们可以看到反向扫描空值成为第一个：

以升序存储且空值在前的索引可以满足 ORDER BY x ASC NULLS FIRST 或 ORDER BY x DESC NULLS LAST，具体取决于扫描的方向。

是否有一种内置方法来描述函数参数及其对 IDE 的作用，因此当您将鼠标悬停在 vscode 中时，您将获得工具提示？

就像是：

function foo(x //integer){
  return x*2 //return square
}

在编译时，我收到无法修复的错误：/

index.ts:2:19 - error TS2307: Cannot find module '@shared'

任何想法为什么会这样？

项目结构：

tsconfig.json：

{
  "compilerOptions": {
    "outDir": "../../build/backend",
  },
  "extends": "../../configs/tsconfig.base.json",
  "references": [
    {
      "path": "../shared"
    }
  ],
  "paths": {
    "@shared": [
      "../shared/index"
    ]
  }
}

后端/index.ts：

import 'module-alias/register'
import { x } from '@shared'

console.log(x)

共享/index.ts：

export const x = 'this is shared index'