小编Mij*_*man的帖子

MUI 导航选项卡不适用于反应路由器

以下是四个组成部分:

应用程序.js:

import React from 'react';
import { Route, Switch } from 'react-router-dom';
import About from './About';
import Home from './Home';

const App = () => {
  return <Switch>
    <Route path="/about">
      <About />
    </Route>
    <Route path="/">
      <Home />
    </Route>
  </Switch>
}

export default App;
Run Code Online (Sandbox Code Playgroud)

导航.js:

import * as React from 'react';
import {Box,Tabs,Tab} from '@material-ui/core';

function LinkTab(props) {
  return (
    <Tab
      component="a"
      onClick={(event) => {
        event.preventDefault();
      }}
      {...props}
    />
  );
}

export default function NavTabs() {
  const [value, setValue] = …
Run Code Online (Sandbox Code Playgroud)

reactjs react-router material-ui react-router-dom

4
推荐指数
1
解决办法
4971
查看次数

Tailwind CSS 不适用于 React App

我正在尝试使用 React 应用程序添加 Tailwind CSS。我遵循顺风文档,如何使用反应设置顺风。

我尝试使用 tailwind 最新版本。我检查了 Nodejs 和 npm 是否安装完美。

但是当我运行它时npm run start总是出现错误。我无法解决这个问题。

在此输入图像描述

包.json

{
  "name": "tailwind-css",
  "version": "0.1.0",
  "homepage": "",
  "private": true,
  "dependencies": {
    "@craco/craco": "^6.1.2",
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.5.0",
    "@testing-library/user-event": "^7.2.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "react-router-dom": "^5.2.0",
    "react-scripts": "^4.0.3"
  },
  "scripts": {
    "start": "craco start",
    "build": "craco build",
    "test": "craco test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "engines": {
    "npm": "6.14.6",
    "node": "12.18.4"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead", …
Run Code Online (Sandbox Code Playgroud)

javascript node.js node-modules reactjs tailwind-css

3
推荐指数
2
解决办法
4万
查看次数

React Mathjax2 不适用于 React 版本 17

我之前在 React 16 上运行过 recat-matcjax2。它运行得很好。但是当将 React 版本 16 更新到 17 时,它不能完美工作。

我收到几个错误。

这是两个错误文件。

在此输入图像描述

在此输入图像描述

尝试实施:

import MathJax from 'react-mathjax2';
const equation = '(a+b)^2';

const MathJax = () => {

return <MathJax.Context input='ascii' key='math'>
                           
          <MathJax.Node inline>{equation} </MathJax.Node>

       </MathJax.Context>
}
Run Code Online (Sandbox Code Playgroud)

我的index.html档案

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8" />
  <link rel="icon" href="%PUBLIC_URL%/favicon.ico" />
  <meta name="viewport" content="width=device-width, initial-scale=1" />
  <meta name="theme-color" content="#000000" />
  <meta name="description" content="Web site created using create-react-app" />
  <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />

  <script type="text/x-mathjax-config">
   MathJax.Hub.Config({
    tex2jax: {delimiters: [['$','$']]},
    "HTML-CSS": …
Run Code Online (Sandbox Code Playgroud)

html javascript node.js mathjax reactjs

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