相关疑难解决方法(0)

为什么JSX道具不应该使用箭头函数或绑定?

我正在使用我的React app运行lint,我收到此错误:

error    JSX props should not use arrow functions        react/jsx-no-bind
Run Code Online (Sandbox Code Playgroud)

这就是我正在运行箭头功能(内部onClick)的地方:

{this.state.photos.map(tile => (
  <span key={tile.img}>
    <Checkbox
      defaultChecked={tile.checked}
      onCheck={() => this.selectPicture(tile)}
      style={{position: 'absolute', zIndex: 99, padding: 5, backgroundColor: 'rgba(255, 255, 255, 0.72)'}}
    />
    <GridTile
      title={tile.title}
      subtitle={<span>by <b>{tile.author}</b></span>}
      actionIcon={<IconButton onClick={() => this.handleDelete(tile)}><Delete color="white"/></IconButton>}
    >
      <img onClick={() => this.handleOpen(tile.img)} src={tile.img} style={{cursor: 'pointer'}}/>
    </GridTile>
  </span>
))}
Run Code Online (Sandbox Code Playgroud)

这是一个应该避免的不良做法吗?什么是最好的方法呢?

javascript jsx ecmascript-6 reactjs arrow-functions

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

Axios ReactJS - 无法读取undefined的属性'setState'

我在ReactJS中做一个简单的事情时收到错误"TypeError:无法读取未定义的属性'setState'.我正在尝试使用axios来填充带有响应数据的输入.到目前为止没有成功.我对axios和ReactJs都很新,所以它可能是我忽略的非常简单的东西?

在修复TypeError之后,我希望"RESPONSE TEXT"显示在表单的输入字段中.

这是我的组成部分:

class BasicInfoBlock extends React.Component {
    constructor(props) {
        super(props);

        this.state = { name : "EventTestName" };
    }

    componentDidMount() {
        axios
        .get(getBaseUrl()+`get`)
        .then(function (response) {
            this.setState({name: "RESPONSE TEXT"});
            //this.setState({name: response.data.name});
        })
        .catch((e) => 
        {
            console.error(e);
        });
        //this.setState({});
    }


    render(){
        return(
                <form className="form-horizontal">
                    <div className="form-group">
                        <label htmlFor="eventName" className="col-sm-2 control-label">Name</label>
                        <div className="col-sm-10">
                        <input type="text" id="eventName" className="form-control" placeholder="Event name" defaultValue={this.state.name}/>
                        </div>
                    </div>
                </form>
            );
    }
}
Run Code Online (Sandbox Code Playgroud)

}

谢谢您的帮助

编辑:这不是一个重复的问题,这个问题涉及'this'在回调中不可用.选为重复的问题与bind有关.

javascript reactjs axios

14
推荐指数
1
解决办法
7192
查看次数

React-无法读取undefined的属性'setState'

出于某种原因,我收到错误"React-无法读取未定义的属性'setState'".因此,this.state永远不会使用用户输入的值进行更新.当我尝试注释掉的绑定时,我得到了奇怪的行为,我无法输入用户名的输入,我不再得到null错误,但值只是未定义.任何帮助,将不胜感激.谢谢.

import __fetch from "isomorphic-fetch";
import React from "react";
import InlineCss from "react-inline-css";
import Transmit from "react-transmit";

import Header from './components/header'

class Registration extends React.Component {

    componentWillMount () {
        if (__SERVER__) {
            console.log("Hello server from Registration");
        }

        if (__CLIENT__) {
            console.log("Hello Registration screen");
        }
    }

    constructor () {
        super()

        this.state = {
            name: '',
            password: ''
        }

         //this.onChangeName = this.onChangeName.bind(this);
         //this.onChangePassword = this.onChangePassword.bind(this);
    }

    onChangeName(e) {
        //this.state.name = e.target.name
        this.setState({ name: e.target.name});
    }

    onChangePassword(e) {
        //this.state.password = e.target.name
        this.setState({ password: …
Run Code Online (Sandbox Code Playgroud)

html javascript forms this reactjs

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

类型错误:无法读取未定义的属性(读取“setState”)

我在尝试什么?

尝试在状态中设置输入类型文本的值

到目前为止我搜索了什么?

React - 未捕获类型错误:无法读取未定义的属性“setState”

但这并不能回答我的问题

错误详情

类型错误:无法读取未定义的属性(读取“setState”)

在函数setEmailVal中设置email的值时出现此错误

在此输入图像描述

成分

import React from 'react';

class Login extends React.Component {
    constructor(props) {
        super(props);
        this.state = {email: ""};
    }

    setEmailVal(val) {
        this.setState({email: val.currentTarget.value});
    }

    render() {
        return (
            <input type="text" onChange={this.setEmailVal} value={this.state.email} />
        );
    }    
}

export default Login;
Run Code Online (Sandbox Code Playgroud)

reactjs

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

React JS:从React.createClass更新时无法读取未定义的属性'setState'

我正在更新要使用的React组件:

class SearchFilms扩展了React.Component

代替:

var SearchFilms = React.createClass({

当我运行这个时,我收到以下错误:"无法读取未定义的属性'setState'"

谁能建议我如何更新这个?

class SearchFilms extends React.Component { 
//var SearchFilms = React.createClass({

    getInitial() {
        return {
            userInput: ''
        };
    }

    onChange(event) {
        this.setState({
            userInput: event.target.value
        });
        this.props.newVal(event.target.value);
    }

    render() {
        var languages = ['Shutter Island', 'Inception', 'Titanic', 'Blood Diamond'];

        return (
            <div className="row" id="Nav">
                <input type="text" 
                    value={this.props.userInput}
                    onChange={this.onChange}
                />
            </div>
        )       
    }

}
Run Code Online (Sandbox Code Playgroud)

components reactjs

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

'this.setState'有什么问题

请问我的反应类有这个问题,我正在尝试更新我的状态,但我得到这个错误"无法读取属性'setState'的未定义"..我已经尝试过在线的每个解决方案,但没有运气

这是代码

export default class PageBackground extends Component{
    constructor(props) {
            super(props);

            this.state={
                lat         :'nothing',
                longi       :''
            };
            this.getLocation=this.getLocation.bind(this);
            }


        componentWillMount() {
            this.getLocation();
        }
        getLocation () {

            fetch('http://freegeoip.net/json/')
             .then((res)=>res.json())
             .then(function (objec){this.setState({lat:objec.latitude,longi:objec.longitude});})
             .catch((err)=>console.log("didn't connect to App",err))
             console.log(this.state.lat)
        }

        render(){
            return(
                <p>{this.state.lat}</p>
                )
            }
        }
Run Code Online (Sandbox Code Playgroud)

reactjs

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

无法读取未定义的属性“ setState”

import React,{Component} from 'react';
import ReactDOM from 'react-dom';
import axios from 'axios';
import videoDetails from './components/listvideos';

class YoutubeApp extends Component {
    constructor(props){
        super(props)

    this.state = {
          videos:[]
    };

    this.apiCall('surfing');
    
   
}
    apiCall(term){
        const params = {
            part: 'snippet',
            key:APP_KEY,
            q:term,
            type: 'video'
        };
    axios.get(APP_URL, { params: params})
        .then(function(response) {
           this.setState({
               videos:response
           })
        })
        .catch(function(error) {
        console.error(error);
      });
   }

    render(){
        
        return (
            <div>
            <videoDetails/>
            </div>
        )
    }


}


ReactDOM.render(
    <YoutubeApp/>,
    document.getElementById('app')
)
Run Code Online (Sandbox Code Playgroud)
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.8/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.8/react-dom.min.js"></script>
<div id="app">
</div>
Run Code Online (Sandbox Code Playgroud)

嗨,我正在尝试制作youtube克隆作为练习,我是一个初学者,但是我看不到为什么反应状态会给我一个问题,我正在尝试将状态设置为我的视频数组,以便可以将其传递给其他组件我没有包含api密钥或url,但是通过错误{无法读取未定义的属性'setState'}的方式非常可读

javascript babel ecmascript-6 reactjs webpack

0
推荐指数
1
解决办法
1082
查看次数