Leaflet doesnt remove control from map

I have been trying to run the following function in different ways and forms, however I can't get the function to remove the control, unless I get rid of the if statement

My goal is to:

• Add control when drawing is enabled
• Remove control when drawing is disabled

allowDrawing() {
    const map = this.$refs.map.mapObject;

    const featureGroup = new window.L.FeatureGroup().addTo(map);

            const drawControl = new window.L.Control.Draw({
                position: "topright",
                draw: {
                    polygon: false,
                    marker: false,
                    polyline: false,
                    circlemarker: false,
                    rectangle: false,
                    circle: {
                        allowIntersection: false,
                        showArea: true,
                        metric: true,
                        showRadius: true,
                        repeatMode: false,
                        shapeOptions: {
                            polylineID: false,
                            color: "#000000",
                            fillColor: "red",
                            weight: 5,
                            fillOpacity: 0.7,
                            lineCap: "round",
                            lineJoin: "bevel",
                            dashArray: "",
                            opacity: 1
                        }
                    }
                },
                edit: {
                    featureGroup: featureGroup,
                    remove: true,
                    edit: {
                        // Set color and fill for edited element
                        selectedPathOptions: {
                            color: "#000",
                            fillColor: "#000"
                        }
                    }
                }
            });
            if (!this.drawingEnabled) {
                this.drawingEnabled = true;
                map.addControl(drawControl);
                map.on("draw:created", function (e) {
                    var type = e.layerType,
                        layer = e.layer;
  
                    featureGroup.addLayer(layer);
                });
                console.log("drawing enabled");
            } else {
                //FREMOVE CONTROL LAYER
                this.drawingEnabled = false;
                map.removeControl(drawControl);
                console.log("drawing disabled");
            }
        },

I think it might be , because the second time the functions runs , it is no longer acessing the same variable(draw control) ??