javascript - レンダリング後に React 子コンポーネントの小道具を変更する

Question

簡単な例を次に示します。

copyButton = <SomeReactComponent title="My Button" />

this.clipboard = new Clipboard('button#copy-button');
this.clipboard.on('success', () => { 
    this.copyButton.props.title = "Copied!";
});

render = () => {
    return (
        ...
        { this.copyButton }
        ...
    );
}

Clipboard.jsを使用して、ボタンが押されたときにテキストをクリップボードにコピーします。コピーが成功したら、それを反映するようにコピー ボタンのタイトルを変更したいと思います。私が参照しているボタン コンポーネントは既にレンダリングされており、this.copyButton.props.titleコンポーネントが不変であるため、明らかに機能しません。

titleでは、ボタンの値を変更するにはどうすればよいでしょうか。親コンポーネントに状態プロパティを含めることができることはわかっていますが、親コンポーネントを完全にステートレスに保つためにそれを避けたいと思います。this.copyButton成功のコールバック内で単純に再割り当てできますか (試してみましたが、うまくいきませんでした)。

より一般的に言えば、親コンポーネントは子のプロップを更新する場合、どのように更新する必要がありますか? 状態を使用することが本当に唯一の方法ですか?

注: それが重要な場合は、ES6 を使用しています。