小编Pet*_*cec的帖子

React + TypeScript 错误:没有与此调用匹配的重载

通过数组映射时,我收到一个巨大的错误,例如:

// Home.tsx

  render() {
    const { inputs, outputs, expectedOutputs } = this.state;
    return (
        <ContentContainer>
          {inputs.map((input, i) => {
            return (
              <TestRow
                key={i}
                rowNumber={i}
                xml={inputs[i].xml}
                desc={inputs[i].desc}
                output={outputs[i]}
                expectedOutput={expectedOutputs[i]}
                handleTextAreaUpdate={this.handleTextAreaUpdate}
              />
            );
          })}
        </ContentContainer>
    );
Run Code Online (Sandbox Code Playgroud)
// TestRow.tsx

interface TestRowProps {
  xml: string;
  desc: string;
  output: string;
  expectedOutput: string;
  rowNumber: number;
}

class TestRow extends Component<TestRowProps, {}> {
  textArea: any;
Run Code Online (Sandbox Code Playgroud)

错误是:

没有重载匹配这个调用。重载 1 of 2,'(props: Readonly): TestRow',出现以下错误。

    Type '{ key: number; rowNumber: number; xml: string; desc: string; output: never; expectedOutput: string; …
Run Code Online (Sandbox Code Playgroud)

typescript reactjs

12
推荐指数
1
解决办法
7万
查看次数

@mui/system -- 如何将瞬态道具传递给 styled()

我在用着import { styled } from "@mui/system"; 像这样:

const Column = styled("div")<ColumnProps>`
  background: ${(props) => props.backgroundColor ?? "blue"};
`;

export default function App() {
  return (
    <div>
      <Column backgroundColor={"green"}>column</Column>
    </div>
  );
Run Code Online (Sandbox Code Playgroud)

它产生以下错误:

Warning: React does not recognize the `backgroundColor` prop on a DOM element.

我怎样才能传递这样的道具而不让它触发这样的错误?styled-components 具有“transient-props”,可以使用 $ 调用,但不适用于 @mui/system

reactjs material-ui

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

向 Express 路由添加参数时出现 404

我正在尝试传递一个 url 参数,例如

http://xxx/api/users?facebookUserId=10213594301678639

这是我的 App.js:

// route setup
const usersRouter = require('./routes/users');
app.use('/api/users', usersRouter);

module.exports = app;
Run Code Online (Sandbox Code Playgroud)

这是我的 users.js:

router.get('/:facebookUserId', jsonParser, async (req, res) => {
  // get user by facebookUserId
  const users = db.collection('users');  
  const facebookUserId = req.params.facebookUserId; 
  const query = {
    facebookUserId: facebookUserId,
  };
  const user = await findOne(users, query);
  res.json(user);
});

module.exports = router;
Run Code Online (Sandbox Code Playgroud)

我的问题是我一添加就得到404

:facebook用户ID

到 router.get()

javascript express

0
推荐指数
1
解决办法
1598
查看次数

无法将主题传递给“@mui/system” styled()

我试图通过以下方式传递主题:

declare module "@mui/styles/defaultTheme" {
  // eslint-disable-next-line @typescript-eslint/no-empty-interface
  interface DefaultTheme extends Theme {}
}

ReactDOM.render(
  <StyledEngineProvider injectFirst>
    <ThemeProvider theme={theme}>
      <Main />
    </ThemeProvider>
  </StyledEngineProvider>,
  document.getElementById("root")
);
Run Code Online (Sandbox Code Playgroud)

我尝试通过以下方式来阅读:

import { styled } from "@mui/system";

type StyledTabProps = {
  isActive: boolean;
};

const StyledTab = styled("div", {
  shouldForwardProp: (prop) => prop !== "isActive"
})<StyledTabProps>(({ theme, isActive }) => {
  console.log("theme", theme);
  return {
    color: isActive ? "red" : "blue"
  };
});
Run Code Online (Sandbox Code Playgroud)

我尝试传递的主题与最终获得 console.logged 的​​主题不同(调色板对象中缺少属性)

问题的代码沙箱可以在这里找到:

https://codesandbox.io/s/wandering-https-ubhqs?file=/src/Main.tsx

reactjs material-ui

0
推荐指数
1
解决办法
1298
查看次数

标签 统计

reactjs ×3

material-ui ×2

express ×1

javascript ×1

typescript ×1