Vue

HTML

<div id="app">
<div>
  <div v-for="item in items" class="categories" >
  <p>{{item.title}}</p>
  <div class="subMenu">
    <div v-for="childItem in item.child" > <p class="text"> {{childItem.childTitle}}</p> </div>
  </div>
  </div>
</div>  
</div>

CSS

.categories{
  background-color:red;
  width:100px;
  height:200px;
  position: relative;
}

.subMenu{
  display: none;
  position:absolute;
  background-color:red;
  height:150px;
  width:150px;
  top: 0;
  left: 100%;
}

.categories:hover .subMenu {
  display: block;
}

Vue

new Vue({
  el: "#app",
  data: {

    items: [
    {
       title: 'name'
      },
      {
       title:'hoverMe',
       child : [
       {childTitle : 'ChildTitle1'},
        {childTitle : 'ChildTitle2'},
         {childTitle : 'ChildTitle3'},
         
       ] ,
       },
       { 
        title: 'name3'}
    ]
  },
})