Accessing the preview's ref

[MaximeTroiano]

My code that is being ran in the <LiveProvider /> of React-Live is a definition of a React-extended class. Like for example:

class Example extends React.Component {
    constructor() {
        this.state = {
            times: 0
        };

        // binds
        this.onClickButton = this.onClickButton.bind(this);
    }

    onClickButton() {
        let {
            times
        } = this.state;

        this.setState({
            times: times + 1
        });
    }

    render() {
        let {
            times
        } = this.state;

        return (
            <div>
              <h6>Welcome to the example</h6> 
              <h4>You clicked the button {times} times !</h4> 
              <button onClick={this.onClickButton}>Click</button> 
            </div>
        );
    }
}

Now when the live preview gets rendered, I get the component correctly:

My question now is: how can I access the ref of the rendered component ?

In normal cases I would have been accessing the ref by giving it to the component like so:

<Example ref={el => console.log("Ref", ref)} />

I need to manually trigger functions that are present inside the component.

Thank you for your help.

[crowdland]

@MaximeTroiano Have you found a solution to this? I need it to change the rendered element's props from the outside.

[MaximeTroiano]

@MaximeTroiano Have you found a solution to this? I need it to change the rendered element's props from the outside.

Unfortunately no, but I guess you could realize this by passing your changing "props" in the scope prop of the LiveProvider.