Home>

I want to make settings so that the favorite button can be switched on and off.

Contents of question

We have set fa-star and fa-star-o so that you can switch the favorite button ON and OFF.
The execution result did not change, so I investigated what was the cause, but I could not solve it.

Please give me advice.

Change the favorite link icon to no fill (fa-star-o)
$(# messageId-${messageId}) .find ("i"). removeClass ('fa-star');
$(# messageId-${messageId}) .find ("i"). addClass ('fa-star-o');

// Change the favorite link icon to filled (fa-star)
$(# messageId-${messageId}) .find ("i"). removeClass ('fa-star-o');
$(# messageId-${messageId}) .find ("i"). addClass ('fa-star');

Source code


body "> user-name ">
text "> info ">
favorite-link "> favorite-icon fa fa-star-o ">








* /
favoritesRef.on ('child_removed', (favSnapshot) =>{
const messageId = favSnapshot.key;

// Do nothing if favorites have been deleted
if (! dbdata.favorites) {
return;
}

// TODO: Delete the relevant data from dbdata.favorites

delete dbdata.favorites [messageId];
console.log ('deleted.');

// Delete the favorite information from the favorite list modal
$(# favorite-message-id-${messageId}) .remove ();

// TODO: Change the favorite link icon to no fill (fa-star-o)
$(# messageId-${messageId}) .find ("i"). removeClass ('fa-star');
$(# messageId-${messageId}) .find ("i"). addClass ('fa-star-o');

});

/ **

  • Register the child_added event handler for favorites
    * (Processing when a favorite is added)
    * /
    favoritesRef.on ('child_added', (favSnapshot) =>{
    const messageId = favSnapshot.key;
    const favorite = favSnapshot.val ();

if (! dbdata.favorites) {
// Initialize the data
dbdata.favorites = {};
}

// Register in TODO: dbdata.favorites
dbdata.favorites [messageId] = favorite;

console.log (dbdata.favorites);

// Update favorites list modal
addFavoriteMessage (messageId, favorite.message);

// TODO: Change the favorite link icon to filled (fa-star)
$(# messageId-${messageId}) .find ("i"). removeClass ('fa-star-o');
$(# messageId-${messageId}) .find ("i"). addClass ('fa-star');

});
};