vue data函数中定义的对象，如何传参的时候直接获取定义对象的内容

    <script>
    export default {
      data() {
        return {
          queryParams: {
            startTime: null,
            endTime: null
          }
        }
      },
      computed: {
        checkedTime() {
          return {
            startTime: this.queryParams.startTime,
            endTime: this.queryParams.endTime
          }
        }
      }
    }
    </script>
    
    
    
    <template>

          <div>
            <p>Start Time: {{ checkedTime.startTime }}</p>
            <p>End Time: {{ checkedTime.endTime }}</p>
          </div>
        </template>

        <script>
        export default {
          props: {
            checkedTime: {
              type: Object,
              required: true
            }
          }
        }
        </script>

使用 computed 属性来定义 传参的名称checkedTime，这样就可以正确地访问 queryParams。 直接在data函数中名义checkedTime，this 指向的还没有被 Vue 实例化的组件对象， 因此无法访问 queryParams。所以要使用 computed 属性来定义传值 在子组件中，我们定义了一个 checkedTime 的 props，并指定了它的类型为 Object，、 并且设置了 required 属性为 true，这样在父组件中没有传递 checkedTime 时会抛出错误。 在模板中，我们可以通过 checkedTime 的属性来访问 startTime 和 endTime 的值。