From 5c7cf5f3345e2e847961d5e6561a365db2e93c92 Mon Sep 17 00:00:00 2001
From: Hilmar Palsson <hilmar90@gmail.com>
Date: Sat, 21 May 2022 20:11:11 +0100
Subject: [PATCH] Put ref in v-show so Vue can pick it up on mount, toggle JSON
 show on click (#1045)

---
 frontend/src/pages/Recipe/NewRecipe.vue | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/frontend/src/pages/Recipe/NewRecipe.vue b/frontend/src/pages/Recipe/NewRecipe.vue
index 6e100865d900..175df1f52c14 100644
--- a/frontend/src/pages/Recipe/NewRecipe.vue
+++ b/frontend/src/pages/Recipe/NewRecipe.vue
@@ -13,19 +13,19 @@
       <RecipePageActionMenu
         logged-in
         :value="true"
-        @json="jsonEditor = true"
-        @edit="jsonEditor = false"
+        @json="jsonEditor = !jsonEditor"
+        @edit="jsonEditor = !jsonEditor"
         @save="createRecipe"
       />
 
-      <div v-if="jsonEditor">
+      <div v-show="jsonEditor">
         <!-- Probably not the best way, but it works! -->
         <br />
         <br />
         <VJsoneditor v-model="recipeDetails" height="1500px" :options="jsonEditorOptions" />
       </div>
 
-      <RecipeEditor ref="recipeEditor" v-else v-model="recipeDetails" @upload="getImage" />
+      <RecipeEditor ref="recipeEditor" v-show="!jsonEditor" v-model="recipeDetails" @upload="getImage" />
     </v-card>
   </v-container>
 </template>