Javascript 无法读取属性';绑定&x27;在反应中未定义的

Javascript 无法读取属性';绑定&x27;在反应中未定义的,javascript,reactjs,Javascript,Reactjs,请先不要将其标记为重复。请阅读我的问题,我尝试在构造函数中绑定我的函数,也尝试作为回报绑定,但我仍然得到错误“无法读取未定义的属性‘bind’”当我从构造函数中删除bind时,它给了我updateComment的错误。我的意思是我试图绑定它,但没有任何帮助 代码: 反应练习 类基础扩展了React.Component { 构造函数(){ 超级(); this.state={编辑:false}; } 编辑(){ this.setState({editing:true}); } 保存(){ thi

请先不要将其标记为重复。请阅读我的问题,我尝试在构造函数中绑定我的函数,也尝试作为回报绑定,但我仍然得到错误“无法读取未定义的属性‘bind’”当我从构造函数中删除bind时,它给了我updateComment的错误。我的意思是我试图绑定它,但没有任何帮助

代码:


反应练习
类基础扩展了React.Component
{
构造函数(){
超级();
this.state={编辑:false};
}
编辑(){
this.setState({editing:true});
}
保存(){
this.setState({editing:false});
this.props.upComment(this.refs.newText.value,this.props.index);
}
删除(){
this.props.delComment(this.props.index);
}
渲染正常(){
返回(
{this.props.children}
编辑
去除
)
}
渲染格式(){
返回(
拯救
)
}
渲染(){
if(this.state.editing){
返回这个.renderForm();
}否则{
返回这个.renderNormal();
}
}
}
类管理扩展了React.Component{
建造师(道具){
超级(道具);
this.removeComment=this.removeComment.bind(this);
this.upComment=this.upComment.bind(this);
此.state={
评论:[
“这是第一条评论”,
“你好!”,
“我正在学习反应”
]
}
}
removeComment(一){
控制台日志(i);
var arr=this.state.comments;
阵列拼接(i,1);
this.setState({comments:arr})
}
更新注释(newText,i){
log(“更新注释”);
var arr=this.state.comments;
arr[i]=新文本;
this.setState({comments:arr})
}
渲染(){
返回(
{this.state.comments.map(函数(text,i){
返回(
{text}
)    
}  
)}
)
}
};
ReactDOM.render(,document.getElementById('example'));

我认为没有必要在构造函数中绑定方法/函数,而是这样做

return (
   <Basics key={i} 
   index={i} 
   upComment={()=>this.updateComment()} 
   delComment={()=>this.removeComment()}>
       {text}
   </Basics>)
返回(
this.updateComment()}
delComment={()=>this.removeComment()}>
{text}
)

在分配道具时,将你的函数包装成匿名函数,这可能会有所帮助。我没有尝试这个

我认为没有必要在构造函数中绑定方法/函数,而是这样做

return (
   <Basics key={i} 
   index={i} 
   upComment={()=>this.updateComment()} 
   delComment={()=>this.removeComment()}>
       {text}
   </Basics>)
返回(
this.updateComment()}
delComment={()=>this.removeComment()}>
{text}
)

在分配道具时,将你的函数包装成匿名函数,这可能会有所帮助。我没有尝试这个

一个问题是,在全局属性事件中调用
.bind()
将导致
函数(){[native code]}
而不是函数调用,并且
是全局对象,例如
窗口

一种方法是将
编辑
删除
定义为
静态
方法,并使用
作为参考

类测试{
构造函数(){}
静态编辑(){console.log(“编辑”)}
renderNormal(){
常量按钮=`click`;
document.body.insertAdjacentHTML(“beforeend”,按钮);
}
}

新的Test().renderNormal()
一个问题是,在全局属性事件中调用
.bind()
将导致
函数(){[native code]}
而不是函数调用,
这是全局对象,例如
窗口

一种方法是将
编辑
删除
定义为
静态
方法,并使用
作为参考

类测试{
构造函数(){}
静态编辑(){console.log(“编辑”)}
renderNormal(){
常量按钮=`click`;
document.body.insertAdjacentHTML(“beforeend”,按钮);
}
}

new Test().renderNormal()
在定义函数时,函数名是
updateComment
,但在将类的上下文绑定到函数时,使用的名称是
upComment
(类
Manage
,在其
构造函数中的第三行)这就是为什么会出现错误。

在定义函数时,函数名是
updateComment
,但在将类的上下文绑定到函数时,使用的名称是
upComment
(class
Manage
,在其
构造函数中的第三行)这就是为什么会出现错误。

代码中有多个错误需要解决

  • 绑定错误是因为