How does a backdraftjs component manipulate a watchable on a subcomponent?

Question

I feel like I am missing something obvious here but looking at this code...

class ShowMessageButton extends Component {                
    showTheInfo() {
        // what goes here??? 
    }
    
    bdElements() {
        return e.div(
            {bdAdvise: {click: 'showTheInfo'}},
            'Click Me to see the Secret Message',
            e(SecretMessage)
        );
    }
}

class SecretMessage extends Component.withWatchables('showMe') {
    constructor(kwargs) {
        super(kwargs);
        this.showMe = false;
    }
    bdElements() {
        return e.div({
            bdReflectClass: ['showMe', s => s ? '' : 'hidden'],
        }, 'You clicked! The secret message is "howdy"')
    }
}

...what goes in showTheInfo to set SecretMessage's showMe watchable to true?

Answer 1

Ah! figured it out. Need to set bdAttach to get a reference to the subcomponent:

class ShowMessageButton extends Component {                
    showTheInfo() {
        this.secretMsg.showMe = true;
    }
    
    bdElements() {
        return e.div(
            {bdAdvise: {click: 'showTheInfo'}},
            'Click Me to see the Secret Message',
            e(SecretMessage, {bdAttach: 'secretMsg'})
        );
    }
}