本文主要介绍VUE实现的一个简单的学生信息管理系统。本文通过示例代码对你进行了非常详细的介绍，对你的学习或者工作有一定的参考价值，有需要的朋友可以参考一下。
一.主要职能
本任务主要是利用VUE实现一个简单的学生信息管理系统，主要功能有：
1.显示所有学生的信息(默认值为10)
2.点击按钮显示学生信息，学生编号以唐山建站公司单数(或偶数)结尾
3.增加学生信息
4.需要在VUE的父组件和子组件之间进行通信
第二，观念的实现
1.数据管理：使用json数组来管理存储的数据
2.显示学生信息：由于组件是一个可重用的Vue实例，这里引入了一个子组件(用于显示每个学生的信息)，主页作为父组件。主页(父组件)使用v-for循环显示子组件。
3.单双数筛选查找学生：循环遍历json数组，做判断，将合格信息放入新的json数组。
4.使用v-if在主页上显示符合筛选条件的学生的信息。
第三，代码实现
1、父子组件定义
父组件：首先定义要调用的组件
导出默认值{
名称： 'HelloWorld '，
组件： {
ChildCom//调用组件
},
子组件：
导出默认值{
姓名： '儿童'，
prop :[
“卡片项目”
],
data () {
返回{
}
}
}
2、组件中的通信
组件通过Prop将数据传递给子组件
父组件：使用v-for遍历学生信息数组
通过：card_item（子组件定义的接受数据的名字） = “stu”（父组件传给子组件的数据）
div v-if='flag_danshu==1 '
child-com id=' 1 ' class=' list ' v-for='(stu，index 1)in new _ list _ danshu ' : key=' index 1 ' : card _ item=' stu '
/Child-com
/div
div v-else-if=' flag _双树==1 '
new _ list _双树' : key=' index2 ' : card _ item=' stu '中child-com id=' 2 ' class=' list ' v-for='(stu，index 2)
/Child-com
/div
div v-else-if='flag_all==1 '
child-com id=' 3 ' class=' list ' v-for='(stu，index 3)in stu _ list ' : key=' index 3 ' : card _ item=' stu '
/Child-com
/div
子组件：
Div名称：{{ card_item.name }} /div
Div学号：{{card_item.stuId}}/div
Div v-if='card_item.gender==1 '性别：男/div
Div v-else性别：女/div
3、显示出学号尾号为单数(或双数）的学生信息(以单数为例)
danshu (stu_list) {
