將刪除，添加，修改，搜索，作成組件

在父組件中：
<!-- 添加 編輯 刪除 搜索 -->
<serchObj :checkCon="multipleSelection"
  v-on:update="update"
  v-on:add="add"
  v-on:delete="delete1"
  v-on:search="search">
 </serchObj>
 data() {
    return {
        multipleSelection: [],
    }
}
 <script>
  handleSelectionChange(val) {
  console.log(val)
  this.multipleSelection = val;
},
 </script>
 在子組件：
 <template>
  <div class="LedgerSearch">
    <div class="handle">
      <el-button
        type="primary"
        :class="{'disab': disableconup }"
        :disabled="disableconup"
        @click="updateCon"
        icon="el-icon-edit"
        size="small"
      >編輯</el-button>
      <el-button
        type="primary"
        :class="{'disab': disablecon }"
        :disabled="disablecon"
        @click="deleteCon"
        icon="el-icon-delete"
        size="small"
      >刪除</el-button>
      <el-button type="primary" icon="el-icon-plus" size="small" @click="addCon">添加</el-button>
    </div>
<div class="Search">
  <input type="text" class="SearchInput" v-model="searchInput">
  <el-button
    type="primary"
    icon="el-icon-search"
    size="mini"
    @click="seachCon"
    style="background-color: #1ab298"
  >搜索</el-button>
</div>
複製代碼

<script>
export default {
  name: "",
  data() {
    return {
      disablecon: true, //禁止選中
      disableconup: true, //編輯禁止選中
      searchInput: "", //搜索
      Title: "", //彈框標題
      parTable: [], //父組件的值
     
    };
  },
  props: ["checkCon"], //接受父組件的傳值

  watch: {
    checkCon: {
      //監聽值變化
      handler(cval, oval) {
        this.parTable = cval;
        if (cval.length > 0) {
          this.disablecon = false;
          if (cval.length > 1) {
            this.disableconup = true;
          } else {
            this.disableconup = false;
          }
        } else {
          this.disablecon = true;
          this.disableconup = true;
        }
      },
      deep: true//進行深度監聽
    }
  },
  methods: {
    // 更新
   updateCon(){
      this.$emit('update','') //子組件向父組件發送方法，並傳值
   },
    // 搜索
    seachCon() {
      console.log(this.searchInput);
      this.$emit('search',this.searchInput) //子組件向父組件發送方法，並傳值
    },
    // 添加
    addCon() {
       this.$emit('add','') //子組件向父組件發送方法，並傳值
    },
   deleteCon(){
      this.$emit('delete',this.parTable) 
   }
  },
  mounted() {}
};
</script>
複製代碼