在输出各种反应成分

我想出来的变量中的组件但是我收到以下错误，在输出各种反应成分

无效的正则表达式：缺少/

我的代码如下，

class Profile extends React.Component { 
    constructor() { 
    super(); 
    this.state = { 
     user:user 
    } 
    this.updateAvatar = this.updateAvatar.bind(this); 
    this.formatName = this.formatName.bind(this); 
    } 

    render() { 
    let user_name = this.formatName(this.state.user.first_name, this.state.user.last_name); 
    console.log(user_name); 
    return (
     <Avatar image={this.state.user.avatar} 
       changeImageOnClick={this.updateAvatar} /> 
     <p>{ user_name }</p> 
    ) 
    } 

    formatName(first_name, last_name) { 
    console.log(first_name); 
    return first_name + " " + last_name; 
    } 

    updateAvatar() { 
     this.setState({user:{avater:'new'}}) 
    } 
}

无法理解我为什么会得到这个错误，这应该是如此简单做:(

来源

2017-07-27 Udders

这是一个奇怪的错误来获得，但无论哪种方式在渲染应该被包裹在一个单一的元素的兄弟元素（即把'div'他们周围）。这不是我期望从中看到的错误，但它仍然需要修复。 – ivarni

您不能返回同一级别上的两个节点。只有一个，所以你需要包装它。试试这个：

class Profile extends React.Component { 
    constructor() { 
    super(); 
    this.state = { 
     user:user 
    } 
    this.updateAvatar = this.updateAvatar.bind(this); 
    this.formatName = this.formatName.bind(this); 
    } 

    render() { 
    let user_name = this.formatName(this.state.user.first_name, this.state.user.last_name); 
    console.log(user_name); 
    return (
     <div> 
     <Avatar image={this.state.user.avatar} 
       changeImageOnClick={this.updateAvatar} /> 
     <p>{ user_name }</p> 
     </div> 
    ) 
    } 

    formatName(first_name, last_name) { 
    console.log(first_name); 
    return first_name + " " + last_name; 
    } 

    updateAvatar() { 
     this.setState({user:{avater:'new'}}) 
    } 
}

来源

2017-07-27 13:14:05 Andrew

在输出各种反应成分

回答

相关问题