In this session we create a comment component to explore how to create components that only render text.
In previous versions of we had to wrap our text in needless <span> or <div>, we will see how React 16 removes the unneeded structure.
import React, { Component } from ‘react‘;
import ReactDOM from ‘react-dom‘;
const Comment = ({ text }) => {
const emojifiedText = text
.replace(‘:)‘, ‘??‘)
.replace(‘:D‘, ‘??‘)
.replace(‘:(‘, ‘??‘);
return emojifiedText;
};
class App extends React.Component {
render() {
return (
<div>
<Comment text="Today we are sailing home :)" />
</div>
);
}
}
ReactDOM.render(<App />, document.getElementById(‘root‘));
[React] Render Text Only Components in React 16
原文：http://www.cnblogs.com/Answer1215/p/7604753.html