title: How to share variable with Nuxt.js from layout to pages?
body: <p>I actually work on a project that consists of display data from Jsons on a Nuxt.js website using Vuetify. I have created a selector in my layout to choose which Json the user wants to display. I need to access this variable from all the different pages of my project.</p>
  
  <p>Here is what my <code>default.vue</code> looks like :</p>
  
  <pre><code>&lt;template&gt;
    &lt;v-overflow-btn
      :items="json_list"
      label="Select an Json to display"
      v-model="selected_json"
      editable
      mandatory
      item-value="text"
    &gt;&lt;/v-overflow-btn&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
  export default {
    data() {
      return {
        selected_json: undefined,
        json_list: [
          {text: "first.json"},
          {text: "second.json"},
        ],
      }
    }
  }
  &lt;/script&gt;
  </code></pre>
  
  <p>The variable I would like to access  from all my different pages is <code>selected_json</code>.</p>
  
  <p>I see many things on the internet such as Vuex or a solution that consist to pass the variable with the URL. But I'm kind of newby in web programming (started Vue/Nuxt one week ago) and I don't really understand how to apply this in my project. So if there is a more easy way to do it or a good explaination, I'm interested!</p>
  
  <p>Thanks in advance for your help :)</p>