我将React与Material-UI一起使用了一段时间,我注意到在一些示例中,当他们使用根时,他们会创建一个名为useStyle的类,然后使用这个标记& > *。我试着搜索这是什么意思,但很难搜索到它。
遵循他们的文档中的一个示例:
import React from 'react';
import { makeStyles } from '@material-ui/core/styles';
import Paper from '@material-ui/core/Paper';
const useStyles = makeS
假设我有一些进程动态地生成一些JSX,但作为一个文字字符串,在本例中是否可以将其返回为,用于呈现导入的组件、Material?
使用下面的内容,我只能获得未样式的标记来显示。
import * as React from 'react';
import { Button } from '@material-ui/core';
export default class Testsp extends React.Component<ITestspProps, {}> {
public render(): React.ReactElement<
我使用的材料UI选项卡和反应-路由器,都是良好的视觉工作,但我意识到,当我使用开发工具时,有一个错误,每次我点击一个选项卡或菜单按钮的情况下,电话的大小。错误说:
index.js:1375 Warning: Material-UI: the value provided/to the Tabs component is invalid. None of the Tabs children have this value. You can provide one of the following values: 0, 1, 2, 3, 4, 5.
我尝试用状态和活动索引结构替换路由器,但是错误
我正在尝试一些非常简单的东西:使用Material-UI主题为网站构建两个主题: A 主题和 一个,但效果不佳:每个Material-UI react元素上都有主题,但html文档上的根元素仍然具有相同的默认白色背景。 当然,可以通过使用纯.css攻击正文来更改它: body {
background-color: #222;
} 但我希望用React动态地改变它,我认为这会起作用,但它不是: import React from 'react';
import ReactDOM from 'react-dom';
import App from '
我有这样的代码:
import React from 'react';
import List from '@material-ui/core/List';
import ListItem from '@material-ui/core/ListItem';
import ListItemIcon from '@material-ui/core/ListItemIcon';
import ListItemText from '@material-ui/core/ListItemText';
import Arrow
当滚动或选择项目时,MultiSelect框弹出继续跳转。
Codepen
import React from "react";
import { makeStyles } from "@material-ui/core/styles";
import Input from "@material-ui/core/Input";
import InputLabel from "@material-ui/core/InputLabel";
import MenuItem from "@material-ui/core/Men
我想在material-ui Autocomplete下拉菜单上显示标题,当有人选择一个选项并提交时,我希望提交年份值(注册到RHF):
import React from "react";
import { useForm, Controller } from "react-hook-form";
import { TextField } from "@material-ui/core";
import Autocomplete from "@material-ui/lab/Autocomplete";
function Ap
我对Material-UI和使用localhost测试我的web应用程序都很陌生。基本上,我已经创建了一个按钮,当用户点击它时,它将路由到外部url (现在是)。由于未知原因,单击按钮将路由到而不是。不确定问题出在哪里?
import React from 'react';
import { makeStyles } from '@material-ui/core/styles';
import Card from '@material-ui/core/Card';
import CardActionArea from '@materia
我是新来的网站,这是我的第一条评论。我有一个我无法解决的问题。我刚开始反应,我构建了一个组件,它从redux获得一个名为类别的数组。
我想将这个数组作为列表打印给用户。
这就是我想要做的,但我得到了错误。
错误:太多的重呈现。React限制呈现的数量,以防止无限循环。
import React from 'react';
import { makeStyles } from '@material-ui/core/styles';
import List from '@material-ui/core/List';
import ListItem
我想知道是否有一些方法可以在Material-UI中使用::selection。代码:-
import React from 'react';
import { makeStyles } from '@material-ui/core';
import List from '@material-ui/core/List';
import ListItem from '@material-ui/core/ListItem';
import ListItemIcon from '@material-ui/core/ListIt
有人能帮助我理解允许从单独的文件导入动态主题对象的正确语法吗?
我正在尝试从媒体查询中获取系统主题,然后动态设置主题。
如果我将所有内容都保留在主应用程序函数中,就可以正常工作,如下所示:
但是在下面的例子中,我想把它分解成不同的文件来组织,但是我的尝试失败了,我得到了错误:themeProvider_js_1.default is not a function
坏掉的例子:
这是重构的第二次尝试,没有错误,我可以在控制台日志中看到ThemeObject,但没有应用系统主题:
未来的代码:工作代码,但我想重构它,这样主题和媒体查询对象就在App组件之外:
import React from &
我首先使用命令npx create-react-app my-app --template typescript创建了一个react应用程序,它工作得很好,并且控制台中没有错误。然后我执行npm install @material-ui/core来安装material UI,在安装material-UI之后,我的react应用程序开始显示以下错误 Could not find a declaration file for module 'react'. 'C:/Users/91727/OneDrive/Desktop/test/node_modules/react/i
下面是我针对单个组件的简单React代码,但每次我检查时它都会抛出相同的警告。即使在复制和传递示例时,仍然会出现相同的警告,并且图标无处可见。请帮帮我! Link import React, { Component } from 'react';
import { Button } from '@material-ui/core';
import AddIcon from '@material-ui/icons/Add';
class AddWorkButton extends Component {
constructor(pro
我使用material-UI的tabs元素,但标签本身是从props接收的。值为0的第一个选项卡中,我希望被选中。 下面是我的代码: import React, { useContext } from 'react';
import { ChannelContext } from '../context/channelContext'
import AppBar from '@material-ui/core/AppBar';
import Tabs from '@material-ui/core/Tabs';
import T
我正在寻找设置SPA页面布局的最佳方法,SPA由顶部的静态标题(AppBar)和标题下面的动态页面内容组成。页面内容ScreenSizePage有时(但并非总是)的高度应该与屏幕的剩余高度完全匹配。换句话说:怎样才能使div在ScreenSizePage中的高度完全符合素材UI应用程序中剩余的屏幕高度?
index.tsx:
import React from 'react';
import ReactDOM from 'react-dom';
import CssBaseline from '@material-ui/core/CssBaseline&
我已经创建了一个选项卡组件,其中有三个选项卡,每个选项卡都包含来自不同端点的数据。我计划使用API的切换案例,因为我有不同的端点。我已经创建了一个onChange函数,在这里我用来调用三个不同的端点,不幸的是我无法实现这个结果,我得到了一个错误,声明useEffect不能在onChange中使用。有没有人能指导我实现这个结果。提前谢谢。
我使用的接口有:、、
import React, { useState, useEffect } from "react";
import Paper from "@material-ui/core/Paper";
import
我有这个素材-UI AppBar: import React from 'react'
import AppBar from 'material-ui/AppBar'
import AccountCircle from 'material-ui-icons/AccountCircle'
import Toolbar from 'material-ui/Toolbar'
import IconButton from 'material-ui/IconButton'
import HomeIcon from '
我在material-ui,nextjs和typescript中有一个项目。我正在尝试让我的导航栏与nextjs一起工作: import * as React from 'react';
import AppBar from '@material-ui/core/AppBar';
import Link from "next/link";
import {Tab, Tabs} from "@material-ui/core";
export default function NavBar() {
return (