小编Apu*_*rvG的帖子
限制刷盒最小和最大宽度
我在我的 React 应用程序中实现了 D3 画笔功能。我想限制画笔的最小和最大宽度。这是我的代码
createBarChart() {
const svg = select(this.myRef.current);
var margin = {
top: 20,
right: 20,
bottom: 110,
left: 40
},
margin2 = {
top: 150,
right: 20,
bottom: 30,
left: 40
},
width = svg.attr("width") - margin.left - margin.right,
height = svg.attr("height") - margin.top - margin.bottom,
height2 = svg.attr("height") - margin2.top - margin2.bottom;
console.log(height2)
parseDate = timeParse("%b %Y");
var x = scaleLinear().range([0, width]),
x2 = scaleLinear().range([0, width]),
y = scaleLinear().range([height, 0]),
y2 = scaleLinear().range([height2, 0]);
var …4
推荐指数
推荐指数
1
解决办法
解决办法
683
查看次数
查看次数
材质UI列表onClick在嵌套列表上触发单击事件
我在其中一个组件中有一个材料ui列表.当我单击此列表中的任何项目时,我转到另一个listView.我正在使用路由器去另一个listView.并使用onClick方法.每当我点击第一个列表的任何列表项时,我都会打印"firstList clicked".每当我点击第二个列表中的任何项目时,它会打印"secondList clicked".
这是我的问题:当我单击第一个列表的ListItem时,console.log("secondList clicked")也会自动打印出"firstList Clicked".我在第二个列表中有四个列表项,所以我的控制台打印输出如下所示
firstList Clicked secondList Clicked secondList Clicked secondList Clicked secondList Clicked
为什么会这样？
这是我的代码.
SecondList代码
class TagListItemDetails extends Component {
handleClick() {
console.log("secondList clicked")
}
handleButtonClick() {
browserHistory.push("TagList")
}
render() {
return (
<MuiThemeProvider>
<div>
<List id="parent-list-tags">
<ListItem primaryText="Kitchen" onTouchTap={this.handleClick()}/>
<ListItem primaryText="Beach" onClick={this.handleClick()}/>
<ListItem primaryText="Marriage" onClick={this.handleClick()}/>
<ListItem primaryText="Garden" onClick={this.handleClick()}/>
</List>
<div className="backButton">
<RaisedButton backgroundColor="#293C8E" label="Back" onClick={this.handleButtonClick} labelColor="white">
</RaisedButton>
</div>
</div>
</MuiThemeProvider>
);
}
}
const mapStateToProps =(state) =>{
return {
tags: state.tagReducer
};
};
function matchDispatchToProps(dispatch){ …3
推荐指数
推荐指数
1
解决办法
解决办法
1万
查看次数
查看次数
选择文件夹而不是单个文件 - 输入
我希望输入类型是文件夹而不是单个文件.如何选择文件夹而不是单个文件.另外,我如何访问该选定文件夹中的每个文件.我试过这个选择一个文件夹,但没有用.我在镀铬.
<input id="myInput" type="file" style={{visibility: 'hidden'}} webkitdirectory directory multiple/>
2
推荐指数
推荐指数
1
解决办法
解决办法
8776
查看次数
查看次数
无法在docker容器中安装pillow
我正在尝试为我的 django 项目构建一个 docker 镜像。该项目使用了枕头，因此我将其放在我的 requiements.txt 文件中。但我在构建图像时遇到错误
\n这是我的 Dockerfile
\n# pull the official base image\nFROM python:3.9.6-alpine\n\n# set work directory\nWORKDIR /usr/src/app\n\n# set environment variables\nENV PYTHONDONTWRITEBYTECODE 1\nENV PYTHONUNBUFFERED 1\n\n# install dependencies\nRUN python3 -m pip install --upgrade pip\nCOPY ./requirements.txt /usr/src/app\nRUN pip install -r requirements.txt\n\n# copy project\nCOPY . /usr/src/app\n\nEXPOSE 8000\n\nCMD ["python", "manage.py", "runserver", "0.0.0.0:8000"]\n这是我的requirements.txt 文件
\nasgiref==3.4.1\nDjango==3.2.9\ndjango-cors-headers==3.11.0\ndjangorestframework==3.13.1\ndjangorestframework-simplejwt==5.0.0\nPillow==9.0.1\nPyJWT==2.3.0\npytz==2021.3\nsqlparse==0.4.2\nwhitenoise==5.3.0\n这是我收到的错误
\nBuilding wheels for collected packages: Pillow\n#9 75.27 Building wheel for Pillow (setup.py): started\n#9 76.43 Building wheel for Pillow (setup.py): finished …2
推荐指数
推荐指数
1
解决办法
解决办法
5002
查看次数
查看次数
Material UI React Table onCellClick 不适用于 TableRow
我的反应组件中有材质 UI 表。我想将 onCellClick 事件添加到表格的每一行。但是当我将 onCellClick 添加到每个 TableRow 时，它不会被触发。但是当我将它添加到我的表格标签时，它就会被解雇。问题是当我将它添加到 Table 标签时，只能对所有行采取一种类型的操作。如果我想在每次单击时对每一行做不同的事情怎么办。这就是为什么我想让所有的 TableRow 标签都有自己的 onClick 类型的事件。我怎样才能做到这一点？
这是我在 Table Tag 上使用 onCellClick 事件的代码，这是我不想要的。
class TagDetailTable extends Component {
handleButtonClick() {
browserHistory.push("TagList")
}
handleCellClick(){
console.log("cell clicked")
}
render() {
return (
<MuiThemeProvider>
<div>
<Table onCellClick= {this.handleCellClick}>
<TableHeader>
<TableRow>
<TableHeaderColumn>ID</TableHeaderColumn>
<TableHeaderColumn>Type</TableHeaderColumn>
<TableHeaderColumn>Category</TableHeaderColumn>
</TableRow>
</TableHeader>
<TableBody>
<TableRow>
<TableRowColumn>1</TableRowColumn>
<TableRowColumn>Cigarette</TableRowColumn>
<TableRowColumn>Compliance</TableRowColumn>
</TableRow>
<TableRow >
<TableRowColumn>2</TableRowColumn>
<TableRowColumn>Cigarette</TableRowColumn>
<TableRowColumn>Compliance</TableRowColumn>
</TableRow>
<TableRow >
<TableRowColumn>3</TableRowColumn>
<TableRowColumn>Cigarette</TableRowColumn>
<TableRowColumn>Compliance</TableRowColumn>
</TableRow>
<TableRow >
<TableRowColumn>4</TableRowColumn>
<TableRowColumn>Alcohol</TableRowColumn>
<TableRowColumn>Compliance</TableRowColumn>
</TableRow>
<TableRow >
<TableRowColumn>5</TableRowColumn>
<TableRowColumn>Alcohol</TableRowColumn>
<TableRowColumn>Compliance</TableRowColumn>
</TableRow> …1
推荐指数
推荐指数
1
解决办法
解决办法
3万
查看次数
查看次数
在POST请求中传递数据
我想在POST请求中发布数据.我有一个登录表单,看起来像这样
render(){
return (
<div className="LoginPage">
<div className="login-page">
<div className="form">
<form className="login-form">
<input id="username" type="username" placeholder="username"/>
<input id="password" type="password" placeholder="password"/>
<p className="message">Not registered? <a href="#">Request Username and Password</a></p>
</form>
<button onClick={this.handleLoginButtonClick.bind(this)}>login</button>
</div>
</div>
</div>
);
}
我在handleLoginButtonClick中发出POST请求
handleLoginButtonClick() {
let token;
var settings = {
"async": true,
"crossDomain": true,
"url": "https://trigger-backend.appspot.com/auth/login/",
"method": "POST",
"credentials": 'include',
"headers": {
"content-type": "application/x-www-form-urlencoded",
},
"data": {
"password": JSON.stringify(document.getElementById("password").value),
"username": JSON.stringify(document.getElementById("username").value)
},
success: function( data, textStatus, jQxhr ){
// alert("success");
},
}
$.ajax(settings).done((response) => { …0
推荐指数
推荐指数
1
解决办法
解决办法
104
查看次数
查看次数
CSS 模块不适用于反应组件
我正在尝试在我的 reactjs 应用程序中使用 css 模块。我已经在webpack.config文件中添加了加载器。
{
test: /\.css$/,
loader: 'style!css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]'
},
但是，当我导入CSS文件中的我的应用程序，并尝试使用它classNames像{styles.example}那么它不会在我的CSS文件链接到。实例。
这就是我的做法：
import styles from './TestPage.css'
<div className={styles.example}></div>
这是行不通的。
组件没有样式。不过，我在控制台中没有收到任何错误。我该如何解决？
0
推荐指数
推荐指数
1
解决办法
解决办法
3277
查看次数
查看次数
标签 统计
javascript ×4
reactjs ×4
material-ui ×2
ajax ×1
css-loader ×1
css-modules ×1
d3.js ×1
docker ×1
dockerfile ×1
jquery ×1
post ×1
react-redux ×1
react-router ×1