小编Edw*_*ssi的帖子

在渲染道具功能中使用反应钩子

取自钩子规则

不要在循环、条件或嵌套函数中调用 Hook。相反,始终在 React 函数的顶层使用 Hooks

鉴于反应团队的这个建议,在渲染道具函数顶部使用钩子是否不可取?假设它取决于函数返回的值。

const MyComponent = () => (
    <RenderPropComponent>
        {value => {
            React.useEffect(() => {
                // Magic
            }, [value]);

            return <p>Hello</p>;
        }}
    </RenderPropComponent>
);
Run Code Online (Sandbox Code Playgroud)

我不觉得这违反了他们的要求

通过遵循此规则,您可以确保每次组件呈现时都以相同的顺序调用 Hook

但是我应该做以下事情吗?

const MyComponent = ({ value }) => {
    React.useEffect(() => {
        // Magic
    }, [value]);

    return <p>Hello</p>;
};

const MyContainer = () => (
  <RenderPropComponent>
      {value => <MyComponent value={value} />}
  </RenderPropComponent>
);
Run Code Online (Sandbox Code Playgroud)

javascript reactjs react-hooks

9
推荐指数
1
解决办法
2282
查看次数

打字稿索引签名

我希望将对象的可分配类型限制为特定类型。例如,一个对象,其中所有键都必须具有number值,例如:

interface NumberMap {
    [key: string]: number;
}
Run Code Online (Sandbox Code Playgroud)

这适用于强制执行值限制,但是随后我将无法确定map变量中实际存在哪些键。

const map: NumberMap = {
  one: 1,
  two: 2,
  three: 3,
};

// no error, but incorrect, this key does *not* exist
const lol = map.weoiroweiroew;

// Also cannot do this
type MyKeys = keyof map;
Run Code Online (Sandbox Code Playgroud)

有没有一种方法可以在不丢失实现该签名的对象具有哪些键的信息的情况下强制执行索引签名?

typescript

6
推荐指数
1
解决办法
1940
查看次数

GraphQL 的 ID 标量有什么意义?

https://graphql.org/learn/schema/#scalar-types

我已阅读说明

ID:ID 标量类型表示唯一标识符,通常用于重新获取对象或作为缓存的键。ID 类型的序列化方式与 String 相同;然而,将它定义为 aID意味着它不是人类可读的。

但在实践中,如果我使用ID而不是,实际上会发生什么变化String

graphql

6
推荐指数
1
解决办法
2487
查看次数

用 HTML5 播放 wav

我正在尝试输出一个文本到语音的 wav 文件并使用 HTML5<audio>标签播放它。text-to-speech 方法正在输出字节,但 html5 控件没有播放它。

如果不是将字节直接流式传输到控件,我先将其保存为文件,然后将文件转换为带有文件流的字节并输出,它开始播放,但我不想每次都保存文件. 我正在使用 MVC 4。

    // in a class library
    public byte[] GenerateAudio(string randomText)
    {
        MemoryStream wavAudioStream = new MemoryStream();
        SpeechSynthesizer speechEngine = new SpeechSynthesizer();
        speechEngine.SetOutputToWaveStream(wavAudioStream);
        speechEngine.Speak(randomText);
        wavAudioStream.Flush();
        Byte[] wavBytes = wavAudioStream.GetBuffer();
        return wavBytes;
    }

    // in my controller
    public ActionResult Listen()
    {
        return new FileContentResult(c.GenerateAudio(Session["RandomText"].ToString()), "audio/wav");
    }

   // in my view
   <audio controls autoplay>
       <source src="@Url.Content("~/Captcha/Listen")" type="audio/wav" />
            Your browser does not support the <audio> element.
   </audio>
Run Code Online (Sandbox Code Playgroud)

html c# asp.net-mvc wav text-to-speech

5
推荐指数
1
解决办法
1522
查看次数

createStore 使用严格的打字稿

import { createStore } from "redux";
import * as storage from "redux-storage";

const reducer = storage.reducer((state, action) => ({}));

const store = createStore(reducer, {});
Run Code Online (Sandbox Code Playgroud)

strict启用打字稿的情况下使用上述代码时,我收到以下警告:

[ts] Argument of type 'Reducer<{}>' is not assignable to parameter of type 'Reducer<{}, AnyAction>'.
       Types of parameters 'state' and 'state' are incompatible.
         Type '{} | undefined' is not assignable to type '{}'.
           Type 'undefined' is not assignable to type '{}'.
Run Code Online (Sandbox Code Playgroud)

我了解什么是 TS 严格模式,但我不明白为什么它将我的状态解释为潜在的 undefined

我可能做错了什么?或者我怎么能在不做一些懒惰的事情的情况下处理错误as any

typescript redux strictnullchecks

5
推荐指数
1
解决办法
748
查看次数

获取使用泛型的函数的返回类型

免责声明:过度简化的功能如下,我知道它们没用

function thinger<T>(thing: T): T {
    return thing;
}

const thing = thinger({ a: "lol" });

thing.a;
Run Code Online (Sandbox Code Playgroud)

上面的代码转换得很好.但我需要将结果thinger<T>放入一个对象中.

interface ThingHolder {
    thing: ReturnType<typeof thinger>;
}

const myThingHolder: ThingHolder = {
    thing: thinger({ a: "lol" }),
};
Run Code Online (Sandbox Code Playgroud)

但是我丢失了我的类型信息,所以myThingHolder.thing.a不起作用

类型"{}"上不存在属性"a"

所以我尝试了以下内容

interface ThingHolder<T> {
    thing: ReturnType<typeof thinger<T>>;
}

const myThingHolder: ThingHolder<{ a: string }> = {
    thing: thinger({ a: "lol" }),
};
Run Code Online (Sandbox Code Playgroud)

但是typeof thinger<T>不是有效的打字稿.

如何根据泛型获得具有不同返回类型的函数的返回类型?

generics typescript typescript-generics

4
推荐指数
1
解决办法
827
查看次数