即使我已经应用了propType验证,我的编辑器在为hasvacancyprop 传递布尔值时会抛出错误.这是我所看到的:
错误:'SyntaxError:JSX值应该是表达式或带引号的JSX文本'
我知道我正在传递'hasvacancy'prop的字符串类型值,但是我需要做什么,所以我可以通过prop传递布尔值或其他数据类型.
import React from 'react';
import { render } from 'react-dom';
class VacancySign extends React.Component{
render() {
console.log('------------hasvacancy------', this.props.hasvacancy);
if(this.props.hasvacancy) {
return(
<div>
<p>Vacancy</p>
</div>
);
} else {
return(
<div>
<p>No-Vacancy</p>
</div>);
}
}
}
VacancySign.propTypes ={
hasvacancy: React.PropTypes.bool.isRequired
}
render(<VacancySign hasvacancy='false'/> ,
document.getElementById('root'));
Run Code Online (Sandbox Code Playgroud) 我正在使用 Pythoncsv.DictReader从 CSV 文件中读取值以创建一个字典,其中键是 CSV 中的第一行或标题,其他行是值。它按预期完美运行,我可以获得字典,但我只希望某些键在字典中,而不是所有列值。做这个的最好方式是什么?我试过使用,csv.reader但我认为它没有这个功能。也许这可以使用熊猫来实现?
这是我在 CSV 模块中使用的代码,其中Fieldnames我想在字典中保留的键。我意识到它不适用于我上面描述的内容。
import csv
with open(target_path+target_file) as csvfile:
reader = csv.DictReader(csvfile,fieldnames=Fieldnames)
for i in reader:
print i
Run Code Online (Sandbox Code Playgroud) 我有一个用户可以上传文档的页面.还有一个按钮可以添加更多文档(如图所示).
我想检查已从上传部分添加或删除的每个文件,以确保大小不超过10 MB.
因此,如果用户上传3个单独的2 MB文件,然后添加一个5 MB的文件,则提交按钮将被禁用,直到其中一个文件被删除,因为它超过了10 MB的限制.
可以动态添加行,因此我按类进行操作并尝试将运行总计相加.
这是我到目前为止所提供的,可在JFIDDLE获得
<form class="upload-form">
<input class='upload-file' type="file" id="upload0">
<input class='upload-file' type="file" id="upload1">
<input class='upload-file' type="file" id="upload2">
<input class='upload-file' type="file" id="upload3">
<input id='submitBtn' type=submit>
</form>
Run Code Online (Sandbox Code Playgroud)
问题是,如果我添加一个文件然后删除它,它就不会反映当前的运行总数.
$("document").ready(function() {
var fileArr = [];
$(".upload-file").on('change',function() {
var fileInput = $('.upload-file');
var fileSize = fileInput.get(0).files[0].size;
fileArr.push(fileSize);
var totalSize = 0;
for (var i in fileArr) {
alert(fileArr[i]);
totalSize = totalSize + fileArr[i];
}
if (totalSize > 10485759) {
alert('Over Max Size');
$(submitBtn).prop("disabled",true);
}
});
});
Run Code Online (Sandbox Code Playgroud)
我也尝试过这种方式,但是在删除文件时无法重置. …
我正在获取一些原始数据并显示一个项目列表.每个项都有一个复杂的属性,我用一个方法生成(它不是一个计算属性).该属性可能会因用户输入而改变.是否可以根据该属性对列表中的项目进行排序?
HTML:
<ul>
<li v-for="item in items">
<span>{{ calculateComplexProperty(item.time) }}</span>
</li>
</ul>
Run Code Online (Sandbox Code Playgroud)
JavaScript的:
calculateComplexProperty: function (time) {
// this.distance is an external factor that is not a property of the list item,
// and that can be manipulated by the user
var speed = time * this.distance;
return speed;
}
Run Code Online (Sandbox Code Playgroud)
因此,每个项目都有一个由全局动态因子"距离"操纵的时间值.这个想法是每当"距离"改变时自动对项目进行排序,并且还更新"速度"属性.这可能吗?
我的目标是创建一个表单,当您按回车键时,它会将您切换到下一个输入元素,并在您进行最后一个输入时提交表单。
这是为移动设备构建的,因为在浏览器中没有使用“下一步”按钮而不是“转到键盘”按钮的选项(有关此问题的更多信息,请参阅此答案)。
我也写了一些代码,但这里的重点是我无法在正确的位置捕获事件,因此表单在返回后立即提交或当我阻止事件时,焦点在我点击后发生变化返回2次。
请参阅此处的示例:https : //codepen.io/ofhouse/pen/Rgwzxy(我也粘贴了下面的代码)
class TextInput extends React.Component {
constructor(props) {
super(props);
this._onKeyPress = this._onKeyPress.bind(this);
}
componentDidMount() {
if (this.props.focus) {
this.textInput.focus();
}
}
componentDidUpdate(nextProps) {
if (nextProps.focus) {
this.textInput.focus();
}
}
_onKeyPress(e) {
if (e.key === 'Enter') {
this.props.onSubmit(e);
}
}
render() {
return (
<div>
<input
type="text"
onKeyPress={this._onKeyPress}
ref={input => {
this.textInput = input;
}}
/>
</div>
);
}
}
class Application extends React.Component {
constructor(props) {
super(props);
this.state …Run Code Online (Sandbox Code Playgroud) javascript ×3
reactjs ×2
dom-events ×1
html ×1
jquery ×1
pandas ×1
python ×1
python-2.7 ×1
react-dom ×1
redux ×1
sorting ×1
v-for ×1
vue.js ×1