标签: reactjs

我正在尝试使用 React React-dnd 制作 Trello 克隆。 只需输入下面的代码我就会收到错误

 const [{ isDragging }, dragRef] = useDrag({
    item: { type: "CARD" },
    collect: (monitor) => ({
      isDragging: monitor.isDragging(),
    }),
  });

我收到以下错误

必须定义spec.type

invariant
C:/Users/lucca/Documents/GitHub/2B-task/src/index.ts:28
 25  |   );
  26 | } else {
  27 |   let argIndex = 0;
> 28 |   error = new Error(
     | ^  29 |     format.replace(/%s/g, function() {
  30 |       return args[argIndex++];
  31 |     })

我创建了一个新项目react-native init MyProject，在 VSCode 中打开它后，我做的第一件事就是安装导航。

npm install @react-navigation/native @react-navigation/stack

它抛出错误，然后我单独执行了这意味着首先我npm install @react-navigation/native成功安装了它，然后我执行了此操作npm install @react-navigation/stack，然后错误再次出现：

 npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency
 tree npm ERR!  npm ERR! While resolving: MyProject@0.0.1 npm ERR!
 Found: react@17.0.1 npm ERR! node_modules/react npm ERR!  
 react@"17.0.1" from the root project npm ERR!   peer react@"*" from
 @react-navigation/stack@5.14.3 npm ERR!  
 node_modules/@react-navigation/stack npm ERR!    
 @react-navigation/stack@"^5.14.2" from the root project npm ERR!  npm
 ERR! Could not resolve dependency: npm ERR! peer …

我正在使用selectionStartandselectionEnd来获取文本选择的起点和终点。

代码： https: //codesandbox.io/s/busy-gareth-mr04o

然而，我正在努力定义可以调用它们的事件类型。如果我使用any，代码可以正常工作，但我更想知道正确的事件。

我尝试过这些类型： Element React.SyntheticEvent<HTMLDivElement> <HTMLDivElement> 没有运气

export default function App() {
  const [startText, setStartText] = useState<number | undefined>();
  const [endText, setEndText] = useState<number | undefined>();

  const handleOnSelect = (event: any) => { <--- I CANNOT FIND THE RIGHT EVENT TYPE
    setStartText(event.target.selectionStart);
    setEndText(event.target.selectionEnd);
  };

  return (
    <Grid container direction="column" className="App">
      You can type here below:
      <TextField
        value={"This is a example, select a word from this string"}
        onSelect={(event) => handleOnSelect(event)}
      />
      <br …

有谁知道如何从 Material-UI 获取所有行数据DataGrid？例如，我更改了DataGrid行内的一些值，并希望在更改后获取所有行。例子：

import { Button, TextField } from "@material-ui/core";
import { DataGrid } from "@material-ui/data-grid";
import moment from "moment";

const columns = [
  {
    field: "Col1",
    headerName: "Col1",
    flex: 1.0,
    disableClickEventBubbling: true,
    sortable: false,
    disableColumnMenu: true
  },
  {
    field: "Col2",
    headerName: "Col2",
    flex: 1.0,
    disableClickEventBubbling: true,
    sortable: false,
    disableColumnMenu: true,
    renderCell: (params) => (
      <>
        <TextField
          type="date"
          defaultValue={moment(Date.parse(params.row.Date)).format(
            "YYYY-MM-DD"
          )}
          InputLabelProps={{
            shrink: true
          }}
        />
      </>
    )
  },
  {
    field: "Col3",
    headerName: "Col3",
    flex: 1.0, …

我需要一些帮助。我是阿波罗客户端反应变量的新手。有一个组件，消息的显示取决于本地状态（apollo 缓存）中的值的变量。在测试将不同值传递到该变量的组件期间，模拟 apollo 缓存将如何？

消息.tsx

const Message: FC = ({ children }) => {
  const message = useReactiveVar(messageVar);

  return (
    <>
      {!!message && (
        <Alert>
          <Typography className={classes.title}>
            Due to scheduled data updates...
          </Typography>
        </Alert>
      )}
      {children}
    </>
  );
};

缓存.ts

export const cache: InMemoryCache = new InMemoryCache({
  typePolicies: {
    Query: {
      fields: {
        maintenanceMessage: {
          read() {
            return messageVar();
          },
        },
      },
    },
  },
});

const maintenanceMessageVar = makeVar<null>(null)

消息.test.tsx

it('render message', () => {
const { getByText } = …

使用 Next JS 我想将路径上的请求重定向/home?id=123qwert到新的目标路径/home/123qwert

我在从源中提取查询参数以在目标中再次使用时遇到问题。

这是我当前的实现：

    async rewrites() {
        return [
            /**
             * My source URL -> /home?id=123qwerty
             * My new destination -> /home/123qwerty
             */
            {
                source: '/home?id=:cmsId*',
                destination: '/home/:cmsId*'
            }
        ];
    }

我的主页有一个动态页面设置/home/[id].js

我不断收到以下错误：

Reason: Unexpected MODIFIER at 5, expected END

  /home?id=:cmsId*
       ^

`source` parse failed for route {"source":"/home?id=:cmsId*","destination":"/home/:cmsId*"}

找到了react-hook-form文件上传的例子。使用“多个”不起作用。如何使用react-hook-form上传多个文件

const labelTypeMap = useMemo<Record<'between' | 'inner', string>>(
  () => ({
    between: formatMessage({ id: 'addGroup' }),
    inner: '+',
    aaa: 123, // no error here
  }),
  []
);

正如代码所示，aaa即使它与 useMemo 的返回类型不匹配，也没有错误。任何帮助都感激不尽。

当我使用 getServerSideProps 函数从 Binance API 检索数据时，出现以下错误。

import binance from "../config/binance-config";

export async function getServerSideProps() {

  const res = await binance.balance((error, balances) => {
    console.info("BTC balance: ", balances.BTC.available);
  });

  return {
    props: {
      res,
    },
  };
}

import Binance from "node-binance-api"

const binance = new Binance().options({
  APIKEY: 'xxx',
  APISECRET: 'xxx'
});

export default binance;

错误输出：

Error: Error serializing `.res` returned from `getServerSideProps` in "/dashboard".
Reason: `undefined` cannot be serialized as JSON. Please use `null` or omit this value.

我不知道如何解决这个错误。我只是希望能够通过将响应作为另一个组件中的道具发送来挖掘（并显示）响应。

谢谢你！

它的文档说，在处理异步代码时，expect.assertions(x)应该编写。断言到底指的是什么？它是纯 JavaScript 的术语吗？