在vue中组件用props传值被监听值被刷新了两次

###### 在vue中，使用组件时遇到组件的数据更新了两次，话不多说，上代码

<-- 组件 -->
<j-line myChartId='my1'  :service-data="[data1, data2]"  />
........
<script>
 data() {
  return {
    data1: [...],
    data2: [....]
  }
}
</script>

子组件

<template>
  <div :id="id"></div>
</template>
<script>
props: {
  serviceData: Array
}
watch: {
  serviceData(val) {
     console.log("我被刷新了")
  }
}
</script>

###### 这样传一个数组过来就会触发子组件这个参数被改变两次，就会触发两次watch的监听，

第一次接收到的是【新的data1，旧的data2】

第二次接收到的是【新的data1，新的data2】

我找很久才看到这个问题，把我搞麻了

###### 我老老实实的将两个参数拼成一个参数在传过去的

<-- 组件 -->
<j-line myChartId='my1'  :service-data="data3"  />
........
<script>
 data() {
  return {
    data1: [...],
    data2: [....],
// 大致是这个意思
    data3: [data1, data2]
  }
}
</script>

###### 自己记录一下，记住这个机制，避免下次踩坑