ElementUI提供了一個非常便捷的菜單組件，可以用來展示導航菜單、下拉菜單等。在應用中，我們經常需要將菜單的數據存儲在后端或前端，通常使用JSON格式。這篇文章將教你如何使用ElementUI來動態加載JSON數據，并將菜單呈現在頁面上。

首先，我們需要使用Menu組件來創建菜單，并使用MenuItem組件來定義每個菜單項。這里還需要使用到el-submenu組件來展示子菜單：

接下來，我們需要使用引入JSON文件并解析數據。ElementUI使用的是axios庫來處理HTTP請求。我們需要在頁面中引入axios庫。

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

接下來，我們需要編寫獲取JSON數據的代碼：

export default {
data() {
return {
menus: []
}
},
created(){
axios.get('/api/menu.json').then((response) =>{
this.menus = response.data.data;
})
},
methods:{
navTo(route) {
this.$router.push({path: route})
}
}
}

在這個代碼片段中，我們使用created周期鉤子來在頁面加載時獲取JSON數據。使用axios來獲取數據是異步的，在獲取數據后，我們將數據存儲在組件的數據部分中（menus），并將其綁定到Menu組件中，動態地呈現在頁面上。

最后，我們需要在后端創建一個返回JSON格式的API。這里，我們可以使用Node.js的Express框架來快速搭建API。具體的方法可以參考Express官方文檔。

以上就是使用ElementUI來動態加載JSON數據并展示菜單的方法。希望本文對你有所幫助。