1.先在components下建立一個新的vue檔案，新增一些基本的配置。

2.在父元件中引用這個新建立的vue並註冊

import SelectItem from "./SelectItem"
export default{
    components:{SelectItem}
}

3.在子元件div裡定義一個class名，並新增一個click事件，此事件是申請修改父元件值的程式;並給此事件定義一個方法

<div class="select-item" @click="changeTitle(0)">
</div>

methods: {
    changeTitle(index) {
      this.$emit("update", index);
    }
  }
 

4.在子元件中申明變數型別，並在父元件中去呼叫

props: {
 
    xinming: {
      type: String,
      default: "bbb"
    },

        <select-item  			  :activeIndex.sync="activeIndex"    
xinming="yrr"
shanchang="abc" >
        </select-item>

5.可用v-for迴圈進行優化，在父元件中新增要傳入的值，效果跟第四部一樣。

data() {
    return {
      userList: [
        {
          name: "Rekkles",
          age:12
          weizhi: "adc"
        },
 

        <select-item v-for="user in userList" :activeIndex.sync="activeIndex"  :xinming="user.name" 
:shanchang="user.weizhi" 
:age="user.age" 
:key="index">
        </select-item>