错误截图：

错误代码：

<template>
	<div class="food-type">
			<div class="type-list">
				<h4>产品分类</h4>
				<small>Food Types</small>
				<ul class="type-list-ul">
					<li class="type-sel type-list-li" v-for="(foodList,i) in foodList" v-bind:data-index="i" >{{ foodList.title }}</li>
				</ul>
			</div>
			<div class="type-content">
				<ul class="type-content-ul">
					<li v-for="foodList in foodList[0].list">  //错误地方：原因为list为定义
						<a href="">
							<span class="food-img-box">
								<img class="food-img" v-bind:src="foodList.url" />
							</span>
							<h2 class="food-title">{{ foodList.name }}</h2>
							<p class="food-content">{{ foodList.content }}</p>
						</a> 
					</li>
				</ul>
			</div>
		</div>
</template>
<script>
	export default {
		data() {
			return {
				index: "",
				foodList:""
			}
		},
		mounted() {
            this.getFood();
        },
		methods: {
			getFood: function() {
				this.$axios.get("../../static/food.json").then((response) => {
				  if(response.data.status==0) {
				  	this.foodList=response.data.result;
				  }
				}, response => {
                    console.log("error"); 
                })
			}
		}
	}
</script>

解决方法：

<template>
	<div class="food-type">
			<div class="type-list">
				<h4>产品分类</h4>
				<small>Food Types</small>
				<ul class="type-list-ul">
					<li class="type-sel type-list-li" v-for="(foodList,i) in foodList" v-bind:data-index="i" >{{ foodList.title }}</li>
				</ul>
			</div>
			<div class="type-content">
				<ul class="type-content-ul">
					<li v-for="foodList in foodListCon">  //修改地方
						<a href="">
							<span class="food-img-box">
								<img class="food-img" v-bind:src="foodList.url" />
							</span>
							<h2 class="food-title">{{ foodList.name }}</h2>
							<p class="food-content">{{ foodList.content }}</p>
						</a> 
					</li>
				</ul>
			</div>
		</div>
</template>
<script>
	export default {
		data() {
			return {
				index: "",
				foodList:"",
				foodListCon:""   //修改地方
			}
		},
		mounted() {
            this.getFood();
        },
		methods: {
			getFood: function() {
				this.$axios.get("../../static/food.json").then((response) => {
				  if(response.data.status==0) {
				  	this.foodList=response.data.result;
				  	this.foodListCon=response.data.result[0].lists;   //修改地方
				  }
				}, response => {
                    console.log("error"); 
                })
			}
		}
	}
</script>

解决后截图：