如何解决警告:findDOMNode在StrictMode中已弃用findDOMNode传递了StrictMode内部的Transition实例
该setState
呼叫看起来好像被写到了错误的地方。确保它在editTodo
对象上:
handleChange = (event) => {
this.setState(state => ({
editTodo: {
...state.editTodo,
title: event.target.value,
},
}));
}
解决方法
我正在尝试使用功能作为组件内部的道具,而该组件是另一个组件的子代。但是功能不起作用。我能知道为什么吗。这是我在控制台中收到的警告。
警告:findDOMNode在StrictMode中已弃用。
findDOMNode传递了StrictMode内部的Transition实例。而是直接将引用添加到要引用的元素
这是我的代码
class Todo extends Component {
state = {
show: false,editTodo: {
id: "",title: "",isCompleted: false
}
}
handleClose = () => {
this.setState({ show: false })
}
handleShow = () => {
this.setState({ show: true })
}
getStyle () {
return {
background: '#f4f4f4',padding: '10px',borderBottom: '1px #ccc dotted',textDecoration: this.props.todo.isCompleted ? 'line-through'
: 'none'
}
}
//this method checks for changes in the edit field
handleChange = (event) => {
this.setState({ title: event.target.value })
console.log(this.state.editTodo.title);
}
render () {
//destructuring
const { id,title } = this.props.todo;
return (
<div style={this.getStyle()}>
<p>
<input type='checkbox' style={{ margin: "0px 20px" }} onChange={this.props.markComplete.bind(this,id)} /> {''}
{title}
<Button style={{ float: "right",margin: "0px 10px" }} variant="warning" size={"sm"} onClick={this.handleShow}>Edit</Button>{' '}
<Button style={{ float: "right" }} variant="danger" size={"sm"} onClick={this.props.DelItem.bind(this,id)}>Delete</Button>
</p>
<Modal show={this.state.show} onHide={this.handleClose}>
<Modal.Header closeButton>
<Modal.Title>Edit your Task!</Modal.Title>
</Modal.Header>
<Modal.Body >
<FormGroup >
<Form.Control
type="text"
value={this.state.editTodo.title}
onChange={this.handleChange}
/>
</FormGroup>
</Modal.Body>
<Modal.Footer>
<Button variant="secondary" onClick={this.handleClose}>
Close
</Button>
<Button variant="primary" onClick={this.handleClose}>
Save Changes
</Button>
</Modal.Footer>
</Modal>
</div>
)
}
}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。