子组件数据回显

1. 定义子组件的props: 在子组件ListWrap中定义需要从父组件接收的props。

// ListWrap.vue
<template>
  <!-- 子组件的模板内容 -->
</template>

<script>
export default {
  name: 'ListWrap',
  props: {
    // 定义接收的数据，比如是一个数组或对象
    dataList: {
      type: Array, // 或者其他类型，如Object, String, Number等
      default: () => []
    }
  },
  // 子组件的其他逻辑...
}
</script>

1. 在父组件中引入子组件: 确保在父组件中引入了ListWrap子组件。

// 父组件.vue
<template>
  <div>
    <!-- 在父组件的模板中使用子组件，并传递数据 -->
    <ListWrap :dataList="parentDataList" />
  </div>
</template>

<script>
import ListWrap from './ListWrap.vue'; // 引入子组件

export default {
  name: 'ParentComponent',
  components: {
    ListWrap // 注册子组件
  },
  data() {
    return {
      // 父组件的数据
      parentDataList: [
        // 数据内容...
      ]
    };
  },
  // 父组件的其他逻辑...
}
</script>

在上面的代码中，:dataList="parentDataList" 是一个prop绑定，它将父组件的parentDataList数据传递给子组件的dataListprop。这样，子组件就可以访问并展示从父组件传递过来的数据了。