在Twilio Video快速入门中添加静音按钮

Question

I'm using this post as a guide on how to add a mute button to my Twilio video Quickstart application. I'm still not able to mute my local participant microphone, however. I added the following code as a promise in my video connection, but it's not even logging the message to the console when I click on #button-mute.

On connecting, the console outputs the following error:

TypeError: Cannot read property 'localParticipant' of undefined

Video.connect(data.token, connectOptions).then(roomJoined, function(error) {
        log('Could not connect to Twilio: ' + error.message);
    }).then(room => {
        const localParticipant = room.localParticipant;

        $button-mute.on('click', event => {
            localParticipant.tracks.forEach((trackId, track) => {
                console.log('In mute function code');
                if (track.isEnabled) {
                    track.disable();
                } else {
                    track.enable();
                }
            })
        })
    });

Answer 1

Twilio developer evangelist here.

The issue here seems to be the return value of your promise. The first part of your code here looks like this:

Video.connect(data.token, connectOptions).then(roomJoined, function(error) {
    log('Could not connect to Twilio: ' + error.message);
}).then(room => {

If your roomJoined function doesn't return the room object then the following then will not have an argument of room and calling room.localParticipant will result in your error.

Ensure that roomJoined returns the room object and it should work.