小编Sin*_*man的帖子

我正在关注https://tailwindcss.com/docs/guides/create-react-app上关于在 React 项目中设置 Tailwind 的文档。我一直在按照这些步骤操作，但是当我到达应该运行npx tailwindcss init以生成tailwind.config.js文件的部分时，出现以下错误：

Cannot find module 'autoprefixer'
Require stack:
- C:\Users\[user]\AppData\Roaming\npm-cache\_npx\16096\node_modules\tailwindcss\lib\cli\commands\build.js
- C:\Users\[user]\AppData\Roaming\npm-cache\_npx\16096\node_modules\tailwindcss\lib\cli\commands\index.js
- C:\Users\[user]\AppData\Roaming\npm-cache\_npx\16096\node_modules\tailwindcss\lib\cli\main.js
- C:\Users\[user]\AppData\Roaming\npm-cache\_npx\16096\node_modules\tailwindcss\lib\cli.js

我检查autoprefixer了我的node_modules文件夹中是否有并尝试重新安装它，但我遇到了同样的错误。在我的package.json，我有以下内容：

...
  "scripts": {
    "start": "craco start",
    "build": "craco build",
    "test": "craco test",
    "eject": "react-scripts eject"
  },
...

根据文档。我的craco.config.js文件如下：

module.exports = {
  style: {
    postcss: {
      plugins: [
        require('tailwindcss'),
        require('autoprefixer'),
      ],
    },
  },
}

再次，根据文档。我也试过重新安装@craco/craco软件包无济于事，所以在这一点上我被卡住了。任何帮助，将不胜感激。

我正在使用react-bootstrap开发一个网站，我有一个容器，其宽度需要更改为60%，并且仍然居中。我更改了宽度，但找不到使容器居中的方法。我怎样才能做到这一点？

这是我的代码：

import {Row, Col, Container, Button} from "react-bootstrap"
import '../CSS/Room.css'

const Room = () => {
    return (
        <>
            <Container fluid>
                <Row className="roomfac fontReg">
                    <Col lg={3} className="text-center">
                       <img src="./Images/logofridge.png" alt="Logo 1"/>
                       <h3 className="fontSB">Fridge</h3>
                    </Col>

                    <Col lg={3} className="text-center">
                       <img src="./Images/logoAC.png" alt="Logo 2"/>
                       <h3 className="fontSB">AC</h3>
                    </Col>

                    <Col lg={3} className="text-center">
                       <img src="./Images/logowifi2.png" alt="Logo 3"/>
                       <h3 className="fontSB">Wifi</h3>
                    </Col>

                    <Col lg={3} className="text-center">
                       <img src="./Images/logotv.png" alt="Logo 4"/>
                       <h3 className="fontSB">TV</h3>
                    </Col>
                </Row>
            </Container>
        </>
    )
}

export default Room

这是我的 CSS：

import {Row, Col, Container, Button} …

大家好，我遇到了有关react-select onBlur 函数的问题，我做了很多研究并研究了相关的git 问题，但仍然找不到答案。OnBlur 函数未获取选定的值，onBlur 中的值显示为未定义。如果答案可用，请推荐我。谢谢您的帮助

Codesanbox 参考链接：

import React, { useState } from "react";
import Select from "react-select";
import "./styles.css";

export default function App() {
  const [value, setValue] = useState();
  const options = [
    {
      label: "first option",
      value: 1
    },
    {
      label: "second option",
      value: 2
    },
    {
      label: "third option",
      value: 3
    }
  ];

  const onSelect = (value) => {
    setValue(value);
  };
  const onBlurValue = (value) => {
    console.log(value);
  };

  return (
    <div>
      <Select
        value={options.label}
        options={options}
        onChange={onSelect} …

在下面的代码中：

如果从ClientSide发送的用户身份验证数据与后端匹配，则后端发送带有用户id的响应，在前面设置，然后组件发送第一种情况，客户端可以访问任何受保护的组件。否则，设置然后组件发送第二种情况，其中仅包含和路由.认证方式安全吗？setIsAuthtrueLayout<Switch>setIsAuthfalseLayout<Switch><Signup /><Login />

  let [isAuth, setIsAuth]=useState( false )

  return (
    <>
      {
       isAuth ? <Switch>
        <Route exact path={"/"} component={ Home } />

        <Route exact path={"/shopping-card"} component={ShoppingCard} />
        <Route exact path={"/order-success"} component={ OrderSuccess } />
        <Route exact path={"/orders"} component={ Orders } />
        <Route exact path={"/products"} component={ Products } />

        <Redirect to={"/user/login"} />
      </Switch> : <Switch>
        <Route exact path={"/user/signup"} component={ Signup } /> …