React Only return props.children

React components MUST have a single root DOM element to render.

From the official docs:

The render() method is required.

When called, it should examine this.props and this.state and return a single child element. This child element can be either a virtual representation of a native DOM component (such as or React.DOM.div()) or another composite component that you've defined yourself.

You can also return null or false to indicate that you don't want anything rendered. Behind the scenes, React renders a tag to work with our current diffing algorithm. When returning null or false, ReactDOM.findDOMNode(this) will return null.

In your case it's easy enough -- just wrap your this.props.children in an outer element of some kind.

render(){
    return (
        <div>{this.props.children}</div>
    )
}

You can return children only without wrapping the children. Trick is to create a wrapper component then modify children into an array, which is required by React.

Wrapper.js

import React, { Component } from 'react';

export default class extends Component {
  render() {
    return React.Children.toArray(this.props.children);
  }
}

Now you can simply just wrap anything else in this wrapper component.

<Wrapper>
  <h1>Hello, world!</h1>
  <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed semper odio nec semper suscipit.</p>
</Wrapper>

Now the elements inside the wrapper will render without having to wrap it in a DIV.

EDIT In React v16+, you can return strings and arrays from components. So, it is perfectly valid for a component to simply return its children...

render() {
  return this.props.children
}

Read more about it in the docs.

ORIGINAL ANSWER

What you have will work IFF there is only one child (and you fix your syntax errors). However, children can be an array of many children and you cannot return an array in a render function. So, you must do one of two things...

1. Enforce that your component only accepts a single child with React.Children...

class LogicCom extends Component {
    render(){
        // this will throw if there are many children
        return React.Children.only(this.props.children)
    }
}

2. Wrap the children in another component...

class LogicCom extends Component {
    render(){
        return <div>{ this.props.children }</div>
    }
}