我正在使用用户事件来尝试进行更“真实”的用户交互。但是，在我单击输入后，它不会触发该onChange功能，因为默认情况下它只会为用户打开文件浏览器以上传文件。如何模拟用户上传文件？
我的代码：
// Component
const FileInputComponent = ({ handleFileUpload }) => (
<div>
<input type="file" id="testing" accept=".png,.jpg" onChange={handleFileUpload} />
<label htmlFor="testing">Input File Here</label>
</div>
);
// Test file
test("Clicking on the label button calls the `handleFileUpload` function", () => {
const handleFileUploadMockFn = jest.fn();
const { getByLabelText } = render(<FileInputComponent handleFileUpload={handleFileUploadMockFn} />
userEvent.click(getByLabelText("Input File Here"));
expect(handleFileUploadMockFn).toHaveBeenCalledTimes(1);
});
我正在关注Andrew Mead 关于 Gatsby 的教程，由于某种原因，我在通过 GraphQL Playground 将查询变量传递到查询时遇到问题。据我所知，查询在节点上运行，因为正在填充“博客”的内容。
这是我的查询变量代码（GQL 游乐场的左下角）。
{
"slug": "example"
}
我正在做的查询：
query ($slug: String!) {
markdownRemark (
fields: {
slug: {
eq: $slug
}
}
) {
frontmatter {
title
date
}
html
}
}
但是，这会导致错误："message": "Variable \"$slug\" of required type \"String!\" was not provided.",
在尝试将变量设为必需和不需要之后，我很确定这是因为查询变量没有被传递，但我无法弄清楚为什么，因为所有其他资源似乎都在做 Andrew Mead 正在做的事情。例如。这里
奇怪的是，当我在 VS Code 上运行查询时，该查询似乎有效，但在操场上却无效。有我缺少的设置吗？
编辑2019-12-18：这是我的一个愚蠢的错误。我点击了HTTP HEADERS左下角的“NOT” QUERY VARIABLES，正如 Daniel Reardon 善意指出的那样。
我正在编辑别人的代码，我只想更改 9000 行文件的 1 行。但是每次我保存时，VS Code 都会格式化整个文件并删除任何尾随空格。这是一个禁忌，因为当我提出这个问题时，审阅者将不知道该看哪一行。
我已经试过禁用漂亮，添加的所有文件.prettierignore，进入VS代码设置和禁用格式化或白色空间中的任何建议修剪，关闭formatOnSave。
这是我的 .vscode/settings.json
{
"prettier.disableLanguages": [
"js",
"json",
"javascript"
],
"javascript.format.enable": false,
"typescript.format.enable": false,
"json.format.enable": false,
"html.format.enable": false,
"emmet.showAbbreviationSuggestions": false,
"css.validate": false,
"editor.defaultFormatter": null,
"editor.formatOnSave": false,
"[javascript]": {
"editor.formatOnSave": false,
"editor.defaultFormatter": null
},
"editor.trimAutoWhitespace": false,
"diffEditor.ignoreTrimWhitespace": false,
"files.trimTrailingWhitespace": false,
"files.trimFinalNewlines": false,
"eslint.format.enable": false,
"files.autoSave": "off",
}
唯一似乎有效的是，如果我这样做了CTRL + SHIFT + P，那么SAVE WITHOUT FORMATTING。但是我可以有什么设置，所以我可以通过正常保存来做到这一点？
完整错误：
Not all constituents of type 'T | ((value: SetStateAction<T>) => void)' are callable.
Type 'T' has no call signatures.
概括：
我正在尝试创建一个useStateIfMounted自定义挂钩。它工作得很好，但我似乎无法为 TypeScript 正确输入它。钩子很好，但是调用者在尝试调用 setState() 时收到错误。我应该如何输入 useCallback() 以便获得 TypeScript 良好的输入系统。args 应该与 React 中的常规 setState 完全相同。
我的代码：
/**
* Same as useState, but the setState will not run if component is unmounted.
*
* The setState is safe to use in dependency arrays because useCallback() has empty dependencies.
*/
export function useStateIfMounted<T>(initialState: T | (() => T)) {
const …