Vue.js 是一款流行的 JavaScript 框架，而人員 (Person) 組件是 Vue.js 中的一個重要考點。

在 Vue.js 中，我們使用組件來封裝相關的 HTML 和 JavaScript，以實現代碼復用和組織的目的。人員組件就是一個具有一定實際意義的組件，用于展示一個人員的基本信息。

<template>
<div>
<h2>{{ personName }}</h2>
<p>{{ personAge }}</p>
<p>{{ personGender }}</p>
</div>
</template>
<script>
export default {
name: 'Person',
props: {
personName: String,
personAge: Number,
personGender: {
type: String,
default: 'Unknown'
}
}
}
</script>

如上所示，我們定義了一個 Person 組件，它有三個屬性：personName、personAge 和 personGender。其中，personName 和 personAge 的類型分別為 String 和 Number，而 personGender 還有一個默認值 'Unknown'。

在組件中，我們使用了 Vue.js 提供的模板語法，通過雙花括號 {{ }} 來輸出屬性的值。同時，我們還將組件暴露出去，并定義了它的名稱為 'Person'。

在使用 Person 組件時，在父組件中給它傳遞相應的屬性值即可。例如：

<template>
<div>
<Person 
:personName="name"
:personAge="age"
:personGender="gender"
/>
</div>
</template>
<script>
import Person from './Person.vue'
export default {
name: 'Parent',
components: {
Person
},
data() {
return {
name: 'Alice',
age: 30,
gender: 'Female'
}
}
}
</script>

如上所示，我們在父組件中引入了 Person 組件，并給它傳遞了相應的屬性值。在 Person 組件中，這些屬性值將被渲染到對應的 DOM 元素中，實現基本信息的展示。

總之，Person 組件是 Vue.js 中的一個重要考點，它涉及到了組件的定義、屬性的傳遞和模板語法的使用。在實際開發中，我們可以根據實際需求，自定義各種各樣的組件，提高開發效率和代碼復用性。