vue父组件页面初始化的时候把数组传递给子组件，并在子组件中拿到数组中的第一项

在父组件中，可以将数组作为一个属性传递给子组件，并且在子组件中通过props接收：

<template>
  <div>
    <ChildComponent :items="items" />
  </div>
</template>

<script>
import ChildComponent from './ChildComponent.vue';

export default {
  name: 'ParentComponent',
  components: {
    ChildComponent,
  },
  data() {
    return {
      items: ['apple', 'banana', 'orange'],
    };
  },
};
</script>

在子组件中，可以在props中声明接收items，并且在组件初始化时拿到数组中的第一项：

<template>
  <div>
    <p>子组件中的第一项是：{{ firstItem }}</p>
  </div>
</template>

<script>
export default {
  name: 'ChildComponent',
  props: {
    items: {
      type: Array,
      required: true,
    },
  },
  computed: {
    firstItem() {
      return this.items[0];
    },
  },
};
</script>

这样，在父组件中初始化时，子组件就可以拿到items数组中的第一项了。