Javascript Cx框架：如何访问Cx中的DOM元素？

我正在探索

Cx

，这是一个基于

React

（）的有趣的新框架，我不知道如何访问组件中的DOM元素

基本上，我有一个简单的小部件，其中包含一些文本和一个按钮，单击按钮时，我希望将该文本复制到剪贴板，由于浏览器的安全限制，这必须通过在输入字段中选择文本并执行

document.execCommand（'copy'）
在React中，我会使用
ref
，它看起来像这样：

class MyWidget extends React.Component {    
    copyToClipboard = () => {
        // copy text from this.textInput to clipboard...
        // select text
        this.textInput.select();
        try {
            // copy selected text
            document.execCommand('copy');
            this.textInput.blur(); // deselect text
        } catch (err) {
            alert('Please press CTRL/CMD+C to copy');
        }
    }
    render(){
        return (
            <div>
                <span className="inputWithButton">
                <input 
                    ref={(input) => this.textInput = input} 
                    type="text" value="some text..." 
                    onClick={this.copyToClipboard}
                />
                <button onClick={this.copyToClipboard} >
                    Copy to clipboard
                </button>
                </span>
            </div>
        );
    }
}

类MyWidget扩展React.Component{
copyToClipboard=（）=>{
//将文本从此.textInput复制到剪贴板。。。
//选择文本
this.textInput.select（）；
试一试{
//复制所选文本
document.execCommand（'copy'）；
this.textInput.blur（）；//取消选择文本
}捕捉（错误）{
警报（“请按CTRL/CMD+C进行复制”）；
}
}
render（）{
返回(
this.textInput=input}
type=“text”value=“一些文本…”
onClick={this.copyToClipboard}
/>
复制到剪贴板
);
}
}

但是Cx在其“自定义组件”中不使用
refs
。有没有其他方法可以做到这一点

任何帮助都将不胜感激。
当Cx小部件需要DOM访问时，通常采用以下两种方式之一进行处理：

使用
event.target
在
copyToClipboard
回调方法中，第一个参数是事件<代码>事件。目标

指向正在单击的DOM元素。您可以使用

event.target.previousSibling

来访问输入，尽管这感觉有点粗糙，如果更改DOM结构，可能会中断

使用反应组件

从Cx渲染方法返回React组件是非常好的。因此，您可以使用已经编写的内容，只需包装在Cx小部件中即可

render(context, instance, key) {
  return <MyWidget key={key} ... />
}

render（上下文、实例、键）{
返回
}