title: VueJS implement go to prev menu
body: <p>I am writing an app where a fixed length list gets generated based on the nested JSONArray. Whenever any elements gets clicked from the list and if it has a "sub data" array,the list gets populated with this "sub data". Basically, you can think of it as menus which has submenus and those submenus has subsubmenus and so on. </p>
  
  <p>I have implemented two methods for going to sublevels [next()] which works fine but I don't know how to implement prev() method to go one level up in the menu. Currently, I can make it go one level up but if user is inside more than two level then I don't know how to keep the track of all above levels.  </p>
  
  <p>Here is the codepen - </p>
  
  <p><a href="https://codepen.io/xblack/pen/gjrBzr?editors=0011" rel="nofollow noreferrer">codepen</a>  </p>
  
  <pre><code>let JSONModel = (_id, _lvl, _title, _data) =&gt; {
    return {
      id: _id,
      lvl: _lvl,
      title: _title,
      data: _data
    };
  };
  
  let Menu = [
    {
      id: "01",
      lvl: "01",
      title: "menu 1",
      data: []
    },
    {
      id: "02",
      lvl: "01",
      title: "menu 2",
      data: []
    },
    {
      id: "03",
      lvl: "01",
      title: "menu 3",
      data: []
    },
    {
      id: "04",
      lvl: "01",
      title: "menu 4",
      data: [
        {
          id: "01",
          lvl: "02",
          title: "submenu 1",
          data: []
        },
        {
          id: "02",
          lvl: "02",
          title: "submenu 2",
          data: [
            {
              id: "01",
              lvl: "03",
              title: "sub submenu 1",
              data: []
            },
            {
              id: "02",
              lvl: "03",
              title: "sub submenu 2",
              data: []
            },
            {
              id: "03",
              lvl: "03",
              title: "sub submenu 3",
              data: []
            },
            {
              id: "04",
              lvl: "03",
              title: "sub submenu 4",
              data: []
            }
          ]
        },
        {
          id: "03",
          lvl: "02",
          title: "submenu 3",
          data: []
        },
        {
          id: "04",
          lvl: "02",
          title: "submenu 4",
          data: []
        }
      ]
    }
  ];
  
  let demo = new Vue({
    el: "#app",
    data: {
      input: Menu,
      prevMenu:[]
    }, 
    computed: {},
    created: function () {  
    },
    methods: {
      next: function(val1,val2) {
        if (val1.length != 0) {
          this.input = val1;
          this.prevMenu = val2;
          console.log(this.prevMenu);
        }
      },
      prev: function() {
        console.log(this.prevMenu);
        this.input = this.prevMenu;
      }
    }
  });
  
  $("#prevmenu").on("click", function() {
    demo.prev();
  });
  </code></pre>