PuffLoader，反应旋转器

Question

在这段代码中，PuffLoader被用于加载程序的from react-spinners 插件。

component code

import React from "react";
import { css } from "@emotion/react";
import PuffLoader from "react-spinners/PuffLoader";

const override = css`
  display: block;
  margin: 0 auto;
  border-color: red;
`;
export default function Loading ({size}:{size:number}) {
  return (
     <PuffLoader css={override} size={size || 60} />;

  );
}

在传递给css组件时，在PuffLoader属性上找到了这个

error

Type '{ css: SerializedStyles; size: number; }' is not assignable to type 'IntrinsicAttributes & LoaderSizeProps'.Property 'css' does not exist on type 'IntrinsicAttributes & LoaderSizeProps'

Answer 1

react的最新版本不再将@emotion/react作为依赖项。您可以只传递一个样式对象。

import React from "react";
import PuffLoader from "react-spinners/PuffLoader";

const override = {
  display: 'block',
  margin: '0 auto',
  borderColor: 'red'
};

export default function Loading ({size}:{size:number}) {
  return (
     <PuffLoader cssOverride={override} size={size || 60} />
  );
}

那应该管用。