Make SimpleBottomSheet unable to change expanded state by itself

Author: MaySoMusician

src/components/SimpleBottomSheet.vue

@@ -1,6 +1,6 @@
 <template>
   <v-bottom-sheet
-    v-model="sheet"
+    :value="expanded"
     class="sheet"
     persistent
     scrollable
@@ -15,7 +15,7 @@
             <v-col class="col message">{{ message }}</v-col>
             <v-col cols="2">
               <span class="add-button">
-                <add-button @addButtonClicked="addButtonClicked" />
+                <add-button @addButtonClicked="$emit('addButtonClicked')" />
               </span>
             </v-col>
           </v-row>
@@ -43,22 +43,6 @@ export default Vue.extend({
       required: false,
       default: true
     }
-  },
-  data() {
-    return {
-      sheet: this.expanded
-    }
-  },
-  watch: {
-    expanded(newValue) {
-      this.sheet = newValue
-    }
-  },
-  methods: {
-    addButtonClicked() {
-      this.sheet = !this.sheet
-      this.$emit('addButtonClicked', this.sheet)
-    }
   }
 })
 </script>