小编los*_*193的帖子

在React中连接变量和字符串

有没有办法合并React的花括号符号和href标签?假设我们在州内有以下价值:

{this.state.id}
Run Code Online (Sandbox Code Playgroud)

以及标记上的以下HTML属性:

href="#demo1"
id="demo1"
Run Code Online (Sandbox Code Playgroud)

有没有办法可以将id状态添加到HTML属性中以获得如下内容:

href={"#demo + {this.state.id}"}
Run Code Online (Sandbox Code Playgroud)

哪个会产生:

#demo1
Run Code Online (Sandbox Code Playgroud)

html javascript ecmascript-6 reactjs

120
推荐指数
4
解决办法
17万
查看次数

React setState不立即更新

我正在研究todo应用程序.这是违规代码的一个非常简化的版本.我有一个复选框:

 <p><input type="checkbox"  name="area" checked={this.state.Pencil}   onChange={this.checkPencil}/> Writing Item </p>
Run Code Online (Sandbox Code Playgroud)

这是调用复选框的函数:

checkPencil(){
   this.setState({
      pencil:!this.state.pencil,
  }); 
  this.props.updateItem(this.state);
}
Run Code Online (Sandbox Code Playgroud)

updateItem是一个映射到dispatch to redux的函数

function mapDispatchToProps(dispatch){
  return bindActionCreators({ updateItem}, dispatch);
}
Run Code Online (Sandbox Code Playgroud)

我的问题是,当我调用updateItem action和console.log状态时,它总是落后一步.如果取消选中该复选框而不是true,我仍然会将true状态传递给updateItem函数.我是否需要调用另一个函数来强制状态更新?

state setstate reactjs redux

52
推荐指数
6
解决办法
4万
查看次数

如何在React/Jsx中调用Render中的函数

我想在一些嵌入式html中调用一个函数.我尝试了以下但是没有调用该函数.这是在render方法中调用函数的错误方法吗?

import React, { Component, PropTypes } from 'react';

export default class PatientTable extends Component {
      constructor(props) {
        super(props);
        this.state = { 
         checking:false
      };
        this.renderIcon = this.renderIcon.bind(this);
  }

  renderIcon(){
    console.log("came here")
    return(
      <div>Function called</div>
    )
  }

  render() {

   return (
       <div className="patient-container">

       {this.renderIcon}      

      </div>
   );
 }
}
Run Code Online (Sandbox Code Playgroud)

javascript render function jsx reactjs

51
推荐指数
2
解决办法
13万
查看次数

在React中检查未定义

我有一个场景,我将数据从reducer传递到我的反应状态.

数据:

{
    "id": 1,
    "title": "Test",
    "content": {
        "body": "sdfsdf"
        "image": "http://example.com"
    }
}
Run Code Online (Sandbox Code Playgroud)

使用componentWillRecieveProps,这非常适合检索标题.

componentWillReceiveProps(nextProps) {
    this.setState({
        title: nextProps.blog.title,
    })
}
Run Code Online (Sandbox Code Playgroud)

但是,我在检索嵌套字段时遇到了困难.当我这样做:

componentWillReceiveProps(nextProps) {
    console.log("new title is", nextProps.blog.title);
    console.log("new body content is", nextProps.blog.content["body"]);
    this.setState({
        title: nextProps.blog.title,
        body: nextProps.blog.content["body"]
    })
}
Run Code Online (Sandbox Code Playgroud)

我收到此错误:

在此输入图像描述

单击调试器并加载内容后,未定义主体的错误消失.无论如何我能解决这个问题吗?

我试着像这样检查undefined:

if (typeof nextProps.blog.content["body"] != 'undefined'){
Run Code Online (Sandbox Code Playgroud)

但这也不起作用,我相信这是因为博客未定义.

components undefined reactjs redux

31
推荐指数
4
解决办法
7万
查看次数

使用Flask从WTForm进行电子邮件验证

我正在关注来自http://code.tutsplus.com/tutorials/intro-to-flask-adding-a-contact-page--net-28982的Flask教程,目前我仍然坚持验证步骤:

旧版本有以下内容:

from flask.ext.wtf import Form, TextField, TextAreaField, SubmitField, validators, ValidationError

class ContactForm(Form):
name = TextField("Name",  [validators.Required("Please enter your name.")])
email = TextField("Email",  [validators.Required("Please enter your email address."), validators.Email("Please enter your email address.")])
submit = SubmitField("Send")
Run Code Online (Sandbox Code Playgroud)

阅读评论后我将其更新为:(用InputRequired替换validators.Required)

(same fields)  

class ContactForm(Form):  
name = TextField("Name", validators=[InputRequired('Please enter your name.')])
email = EmailField("Email",  validators=[InputRequired("Please enter your email address.")]), validators.Email("Please enter your email address.")])
submit = SubmitField("Send")
Run Code Online (Sandbox Code Playgroud)

我唯一的问题是我不知道如何处理validators.Email.我得到的错误信息是:

NameError: name 'validators' is not defined
Run Code Online (Sandbox Code Playgroud)

我查看了文档,也许我没有深入研究,但我似乎无法找到电子邮件验证的示例.

python email validation flask-wtforms

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

在python 3中查找字符串中单词的出现次数

我正在尝试查找字符串中单词的出现次数.

word = "dog"
str1 = "the dogs barked"
Run Code Online (Sandbox Code Playgroud)

我使用以下内容来计算出现次数:

count = str1.count(word)
Run Code Online (Sandbox Code Playgroud)

问题是我想要完全匹配.所以这句话的计数是0.这可能吗?

python string count match

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

Javascript Arrays与包含相反

在javascript中删除具有特定字段的对象的正确方法是什么?

我可以包含以下字段:

filteredResult = filteredResult.filter(e => e.selectedFields.includes("Red"));
Run Code Online (Sandbox Code Playgroud)

但是,如果我想删除所有具有此字段的属性,我该怎么办?文档中似乎没有"删除"

javascript arrays filter

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

React Props未定义

我无法理解为什么我的props.updateBuilding无效.

当prop在render方法中时,以下工作

class Buildings extends Component {
  constructor(props) {
      super(props);
  }

  componentWillMount() {
    this.props.fetchBuildings();
  }

  renderBuildings(building) {
    return (
      <div>
          <p> {building.name}</p>
      </div>
    );
  }


  render() {
    return (
      <div> 
        {this.props.buildings.map(this.renderBuildings)}
        <button type="button" className="btn btn-success" onClick={this.props.updateBuilding.bind(this, 1)}>Edit</button>
      </div>
    );
  }
}

function mapStateToProps(state) {
  return { buildings: state.buildings.all };
}
function mapDispatchToProps(dispatch){
  return bindActionCreators({ fetchBuildings, updateBuilding}, dispatch);
}
Run Code Online (Sandbox Code Playgroud)

但是当我this.props.updateBuilding按照下面的方式添加renderBuildings方法时......

  renderBuildings(building) {
    return (
      <div>
          <p> {building.name}</p>
          <button type="button" className="btn btn-success" onClick={this.props.updateBuilding.bind(this, building.id)}>Edit</button>
      </div>
    );
  }
Run Code Online (Sandbox Code Playgroud)

我收到错误:

Cannot read …
Run Code Online (Sandbox Code Playgroud)

undefined reactjs

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

将蛇形字符串转换为标题大小写

我有以下蛇形变量,big_animal
我想将其转换为Big Animal

我的方法是str => str.replace(/([-_]\w)/g, g => g[1].toUpperCase());

但我不断收到bigAnimal,但我想保留空格并将第一个字母大写。

javascript regex

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

如何在 Javascript 中使用条件进行映射

我正在遍历一个对象数组:

people = [
  {id:1, name:"Bob", available:false},
  {id:2, name:"Sally", available:true},
  {id:1, name:"Trish", available:false},
]
Run Code Online (Sandbox Code Playgroud)

我希望我的输出是可用的名称:

["Sally"]
Run Code Online (Sandbox Code Playgroud)

我目前知道如何映射和提取字段。如何添加条件?

  const peopleAvailable = people.map(person => person.value);
Run Code Online (Sandbox Code Playgroud)

想做这样的事情:

  const peopleAvailable = people.map(person.available => person.value);
Run Code Online (Sandbox Code Playgroud)

javascript filter

7
推荐指数
1
解决办法
2万
查看次数