react pass function as prop without jsx

Question

Hello i'm in a situation where i can use React only with CDN and i don't want to load jsx so i'm trying the hardcore mode, i'm trying to pass a function as prop but i get an error

This is my Code

 const r = React.createElement;
        class Button extends React.Component{
            constructor(props) {
                super(props)
                this.clickMe = this.clickMe.bind(this)
            }
            clickMe = () => {
                this.props.clic()
            }
            render() {
                return r("button", { onClick: this.clickMe }, 'CLICK')
            }
        }
        class Cont extends React.Component {
            constructor(props) {
                super(props)
                this.handleClic = this.handleClic.bind(this)
                this.state = {
                x :"Hello World"}
            }
            handleClic() {
                this.setState({
                    x : "HELLO CHANGED"
                })
            }
                render() {
                    return r('div',
                       
                        this.state.x,
                        r(Button, {clic:this.handleClic})
                       
                    );
                }
        }

        class Wrapper extends React.Component {
            render() {
                return r('div',
                    null,
                    r(Cont),
                    r(Cont),
                    r(Cont),
                    r(Cont),
                    r(Cont),
                    r(Cont),
                )
            }
        }

This is the error

Warning: Invalid attribute name: `0`
    in div (created by Cont)
    in Cont (created by Wrapper)
    in div (created by Wrapper)
    in Wrapper

What am i missing?

Answer 1

This is the signature of createElement():

React.createElement(
  type,
  [props],
  [...children]
)

Where props should be an object. this.state.x is a string.

Maybe you wanted to pass this.state?