父子组件传递
子组件页面名称：tumorUp
父组件页面名称：tumorUpList
父组件代码（tumorUp）
代码解析
第一步： 注册子组件，并在代码中引入传递参数
参数一：myId（这个参数名字要和子 组件接收这个参数的名字一样，否则可能出现接收不到值的问题）
参数二：myMemberId
<tumor-up ref="tumorUp" :myId='id' :myMemberId='memberId' />
第二步： 这两个参数是通过其它页面点击跳转也得时候传递过来，请看如下代码
selecttumorUpList(row) {
this.$router.push({
path: '/sggg/xxxx?id=' + row.id + '&memberId=' + row.memberId,
})
},
我在这个页面去进行接收
activated() {
if (this.$route.query.id) {
this.id = this.$route.query.id
this.memberId = this.$route.query.memberId
}
}
以上是说的传递给组件的这两个参数是怎么来的，下面来说下父组件通过什么方式去调用父组件
很重点哈
在父组件的methods里添加一个方法，onItemClick这个方法我在上面代码中也体现到了，就是我的那个for循环那个位置，显示日期的地方，当我点击某个日期时就会触发这个方法。
忘了说啦，补充一句，引入子组件代码如下
import tumorUp from './tumorUp'
// 在export default {}注册一下
components: {
tumorUp },
onItemClick(id) {
this.$nextTick(() => {
this.$refs.tumorUp.doSomething(id);
});
},
我在子组件声明了doSomething用来监听父组件事件改变时进行触发传入了一个id属于
this.$refs.tumorUp.doSomething(id);
子组件（tumorUpList）
这个地方非常重要，子组件代码，在子组件你只需要声明doSomething方法，因为父组件中当我没点击一次日期的时候就会调用这个方法，渲染数据
子组件methods里声明doSomething方法，这样就完成了父子组件传递，这个方法就是页面刷新渲染的方法，整个流程是当父组件点击某个日期是，调用子组件的doSomething()方法，然后子组件在去调用getByMemberId()方法，实现父子组件传递动态渲染数据 this.getByMemberId()
doSomething(id) {
this.id = id
this.getByMemberId()
},
子组件接收父组件传递的myId和myMemberId参数
直接写到export default里面就行，声明一个props对象，里面有myId和myMemberId两个参数，参数名称要和父组件中的参数名称保持一个，我在上面已经强调过了
export default {
name: 'tumorUp',
props: {
myId: String,
myMemberId: String,
},
赋值这个地方就正常赋值就行，我这个地方加了一个值验证
if (this.myMemberId != null) {
this.memberId = this.myMemberId
}
这个地方是父组件的代码tumorUpList，是html部分的代码
<template>
<div class='box'>
<div v-if='list.length > 0' class='box-list'>
<div class='follow'>
<!-- 注册并引入子组件，并传递两个参数 -->
<tumor-up ref="tumorUp" :myId='id' :myMemberId='memberId' />
</div>
<!-- 这段代码呢是一个列表，这里我用了一个for循环，主要是显示日期的，年月日时分秒，当我点击某个日期时，去刷新子组件页面，渲染当前我点击日期的数据 -->
<div class='list'>
<!-- <div v-for='item in list' class='li' @click='memberId = item.id'>{
{
item.createTime }}</div>-->
<div v-for="item in list" class="li" @click="onItemClick(item.id)">
{
{
item.createTime }}
</div>
</div>
</div>
<div v-else class='null'>
暂无数据
</div>
</div>
</template>
请认真看下这篇文章，你就知道父子组件传递的原理及流程，如果有不明白的博主，私信我，欢迎打扰哦！！！