React 渲染多个跨度，仅使用实际值。有关如何解决此问题的任何建议：

如果重要的话，用户的名字不应该在一个跨度内，而是作为“.chatUser”的innerHTML

实际的渲染方法很短：

createShortUsername: function() {
 // shortName is first two letter of first name. 
 var shortName = this.props.userName.split(" ")[0].slice(0, 2);
 console.log(shortName);
 return shortName;
},
render: function() {
 return (
   <div className="chatUser"> {this.createShortUsername()} </div>
 );
}

谢谢！