Is there a way to remove a particular map from Firestore?

In my Google Firebase setup, I have uniquely named each Map to serve as the index for every document. Using Vuejs (Javascript), I have structured it as follows:

eQFelbD432T (Collection Name- user.uid)
  SKILLS (Document Name)
    ProjectManangement (Map Name)
      Rating: 4      (Key - Value Pair)
      Experience: 2  (Key - Value Pair)
    SystemEngneering (Map Name)
      Rating: 6       (Key - Value Pair)
      Experience: 2   (Key - Value Pair)

Now, I am trying to delete a specific map along with all its values, but I am struggling to figure out how to do so as there seems to be no direct way to target that particular map.

The code I currently have is as follows - however, it is not functioning correctly: The variable mapName contains the name of the map that needs to be deleted (e.g. ProjectManagement) provided by a function.

let ref = db.collection(this.$store.getters.getUserId).doc('SKILLS')
ref.get().then(doc => {
  if (doc.exists) {
    ref.update( { [mapName]: FieldValue.delete() } )
  }
})

I'm hoping someone can assist me with this issue, or perhaps I am overlooking a simple solution...

Thank you and best regards

javascriptfirebasevue.jsgoogle-cloud-firestore

Answer №1

I managed to solve the problem.

This is what the functional code looks like:

ref.get().then(doc => {
          if (doc.exists) {
            ref.update( { [mapName]: firebase.firestore.FieldValue.delete() } )
          }
        })

Interestingly, in order to delete a single map, I had to include "firebase.firestore." before FieldValue despite already importing firebase (import firebase from 'firebase').

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Overlap and cover additional elements within a DIV

I am looking to create a versatile function that can effortlessly overlay various elements such as selects, textfields, inputs, divs, tables, and more with a partially transparent div matching their exact height and width. I have managed to obtain the pos ...

javascriptjquerycssjquery-pluginstwitter-bootstrap-3

Leveraging JS Variables within Twig Template

I am trying to incorporate a JavaScript variable into Twig. Despite attempting to implement the solution mentioned here, my code below does not render the map properly. If I remove the part between "var polylineCoordinates" and "polyline.setMap(map);", th ...

javascriptsymfonygoogle-maps-api-3twig

A step-by-step guide on upgrading or transferring from Vite 2 to Vite 3 using NPM while harnessing the power of Vue

While it may seem like a straightforward question, I found myself unable to locate the specific process or commands for upgrading from Vite 2 to Vite 3 using npm. Despite reading the announcement and the migration guide (along with other resources), I ha ...

vue.jsnpmvite

Turn off Babel's strict mode when transpiling JavaScript files

Currently, I am facing an issue while trying to transpile a set of JavaScript files using Babel. Since Babel operates in strict mode by default, it triggers a syntax error whenever there is a conflict like the use of the delete keyword. The solution I am s ...

javascriptnpmbabeljs

Incorporating script within an ASPX webpage

I've been struggling with using this code on an ASPX page. I keep trying to implement it within a text box on the same page, but without success. Strangely though, I can successfully use the script within a text box in my master page. Any assistance w ...

javascriptc#jqueryasp.net

Leveraging packages obtained from npm repositories

Recently, I came across this guide about React that included a paragraph that left me puzzled. According to the guide, CommonJS modules (found in npm) cannot be directly used in web browsers due to technical limitations. Instead, you need a JavaScript " ...

javascriptnode.jsnpm

Using event.target to pass HTML form data to FormData is causing an error stating that the Argument of type 'EventTarget' cannot be assigned to a parameter of type 'HTMLFormElement'

Looking to extract data from a form and store it in FormData: const handleSubmit = (e: FormEvent<HTMLFormElement>) => { e.preventDefault(); const formData = new FormData(e.target as HTMLFormElement); const value = formData.get(' ...

javascriptreactjstypescript

Utilizing PHP with WordPress: Execute the specified .js file if the link includes the ID "124"

I am currently using WordPress on my local server and I want to set up a redirect after a user submits the contact form through the Contact Form 7 Plugin. I am looking to redirect them to a specific page, but so far, the plugins I have tried have caused th ...

javascriptphpwordpressredirect

How can one correctly log out of an Angular application that is integrated with Firebase Authentication and Firestore?

How can I efficiently sign out of an Angular application that uses Firebase Authentication and Firestore? Although I can successfully sign in with Google authentication, signing out poses some challenges. My ultimate goal is to ensure that when a user cli ...

angularfirebasegoogle-cloud-firestorefirebase-authenticationangularfire

Deleting an element from a reference array in Mongoose

In my code, I have a User model that contains an array of references to other users: friends : [ { type: Schema.Types.ObjectId, ref: 'User' } ] I am currently struggling with removing an item from this list. Here is what I have attempt ...

javascriptnode.jsmongodb

Unable to display response following the submission of a POST request

I'm encountering an issue when attempting to display the response of a post request using node and request. While I can see the response in the console within the service, it does not make its way to the controller. Any insights on why this may be hap ...

javascriptnode.js

What is the best way to set a checkbox to null instead of false using Angular?

I am currently developing a filtering system that allows users to select different parameters to filter through a list of items. For instance, the item list could be a collection of dishes with filters represented as checkboxes labeled as vegan, vegetaria ...

javascripthtmlangulartypescriptcheckbox

Trigger a function when <a> is clicked, which will then increment the count by one and reflect this change in the database

The database generates the content of this div ordered by a count number called "cts". Whenever I click on the div, I want the "cts" number to increase by one, and then update the change in the database. This will result in the content changing accordingly ...

javascriptphpajaxdatabase

Show the current Date and Time dynamically using only one line of JavaScript code

After running this command, I encountered an issue: $("#dateTime").text(new Date().toLocaleString()); The result displayed was 2/21/2020, 10:29:14 AM To make the time increase every second, I attempted this code: setInterval($("#dateTime").text(new Dat ...

javascriptjquerydatetime

Creating a Robust Next.js Build with Tailor-Made Server (Nest.js)

I'm in need of assistance with compiling/building my project using Next.js while utilizing a custom server. Currently, I have integrated Nest.js (a TypeScript Node.js Framework) as the backend and nested Next.js within it. The integration seems to be ...

javascriptreactjstypescriptnext.jsnestjs

Server not recognizing nested routes in React-Router

I am currently using Express.js to render a React application on the server side, but I have encountered an issue where some of my routes are getting skipped over unexpectedly. Here is my server.js: app.get('*', (req, res) => { conso ...

javascriptreactjsexpressreact-router

Using Angular's ng-href directive in conjunction with the Split method

I am encountering an issue with a recursive variable that has a specific value path = <d:URL>http://www.google.com, Google</d:URL> My goal is to bind this path into an Angular component. I have attempted to use the following method to bind th ...

javascriptangularjs

Adding Node.js Express responses to a running list

I have a situation in one route where I am using multiple instances of res.send. Is there a way to combine them all into one and then send the aggregated list at the end? The format I prefer is as follows: { "writer": {success message}, "archive": {succes ...

javascriptnode.jsexpressmongoose

Creating a JSON hierarchy from an adjacency list

I am currently working with adjacency data that includes ID's and Parent ID's. My goal is to convert this data into hierarchical data by creating nested JSON structures. While I have managed to make it work, I encountered an issue when dealing ...

javascriptjqueryarraysjson

Adding an exception for ClickAwayListener in React-MUI

Hey there! I'm currently exploring MUI and trying to incorporate the ClickAwayListener API into my project, but I'm facing some difficulties. You can take a look at my project on codesandbox here: https://codesandbox.io/s/react-leaflet-icon-ma ...

javascriptreactjsmaterial-uileaflet