TypeError: instance.render is not a function

1、错误描述

2、错误原因

import React, {Component} from 'react';
import {render} from 'react-dom';
import Button from 'react-bootstrap/Button'

class InputRead extends Component {
	constructor() {
		return { user: '' };
	}
	
	inputChange(e) {
		this.setState({user:e.target.value});
	}
	
	clearAndFocus() {
		this.setState({user:''},()=>{
			this.refs.thisInput.focus();
		})
	}
	
	render() {
		return (
			<div>
				<Button onClick={this.clearAndFocus.bind(this)}>
					清空
				</Button>
				<input ref="thisInput" value={this.state.user} onChange={this.inputChange.bind(this)}/>
			</div>
		)
	}
}

export default InputRead;

  构造函数中不能使用return语句,否则以为构造函数中需要添加render()方法

3、解决办法

import React, {Component} from 'react';
import {render} from 'react-dom';
import Button from 'react-bootstrap/Button'

class InputRead extends Component {
	constructor(props) {
		//return { user: '' };
		super(props);
		this.state = { user: '' };
	}
	
	inputChange(e) {
		this.setState({user:e.target.value});
	}
	
	clearAndFocus() {
		this.setState({user:''},()=>{
			this.refs.thisInput.focus();
		})
	}
	
	render() {
		return (
			<div>
				<Button onClick={this.clearAndFocus.bind(this)}>
					清空
				</Button>
				<input ref="thisInput" value={this.state.user} onChange={this.inputChange.bind(this)}/>
			</div>
		)
	}
}

export default InputRead;
原文地址:https://www.cnblogs.com/hzcya1995/p/13313710.html