组件复用（详细讲解）
配置项：props（让组件接受外部传来的数据）
app.vue:
<StudentLqjname="李四"sex="女"age="20"></StudentLqj><StudentLqjname="张三"sex="男"age="20"></StudentLqj>
通过在app.vue里面复制多个子组件来实现相同样式的不同数据显示（组件服用）
StudentLqj.Vue(这是自定义的子组件):
template:
<template><div><h1>{{msg}}</h1><h2>学生姓名：{{name}}</h2><h2>学生性别：{{sex}}</h2><h2>学生年龄：{{age}}</h2><button@click="dianji">点击修改姓名</button></div></template>
script:
1.简单接收
<script>props:['name','sex','age']//简单接收</script>
2.选择类型并接收，如果床过来的值与props里面的标志的值的类型不匹配，则在控制台会报错！
<script>props:{ name:String, sex:String, age:Number }//选择类型并接收</script>
3.在接收的同时对每个参数的的类型以及必要或非必要进行判断（最终的接收数据的写法）
<script>props:{ name:{ type:String,//name的类型required:true//name是必须要传递的数据 }, sex:{ type:String,//sex的类型required:true//sex是必须要传递的数据 }, age:{ type:Number,//age的类型default:99//age默认是为99(上一个页面没有给age转递数据是，age将会采用默认值) }, } </script>
最终：
<script>exportdefault { name:'StudentLqj', data(){ return{ msg:'我是一个学生', myname:this.name// sex:'男',// age:20 } }, /*methods:{ dianji(){ this.myname='小胖子' } },*/// props:['name','sex','age']// props:{// name:String,// sex:String,// age:Number// }props:{ name:{ type:String,//name的类型required:true//name是必须要传递的数据 }, sex:{ type:String,//sex的类型required:true//sex是必须要传递的数据 }, age:{ type:Number,//age的类型default:99//age默认是为99(上一个页面没有给age转递数据是，age将会采用默认值) }, } } </script>
注意：xxx="...",引号里面的数据默认都是字符串类型，我们需要在前面加上：（冒号）vue就自动帮我们把""里面的数转换成js表达式的形式。
如：
<StudentLqjname="李四"sex="女":age="20"></StudentLqj><StudentLqjname="张三"sex="男":age="20"></StudentLqj>
注意：
props是只读的，Vue底层会监视你对props的修改，
如业务需求要修改props中的数据，如下操作：
注意：props中接收的数据是不能直接在子组件中改动的（直接改动会报错）
如果像在自组加中修改props中接收的数据，可以借助子组件接收数据的优先级原理：
优先级：props>data
子组件中props接收的数据会先传到子组件（vm身上），也就是先传到了this中:
在子组件中的data（）{console.log(this.name)}可以得到name的值，
借助这个可以：
再声明一个变量（myname）
template:
<h2>学生姓名：{{myname}}</h2><button@click="dianji">点击修改姓名</button>
script：
<script>data(){ return{ msg:'我是一个尚硅谷的学生', myname:this.name// sex:'男',// age:20 } }, methods:{ dianji(){ this.myname='小胖子' } }, </script>
