技術標籤：js

結果：

<template>
 <el-select v-model="input"
 			filterable
            clearable
            @blur="selectBlur"
            @change="shipChange"
            placeholder="請輸入沙場資訊"
            style="width: 100%;margin-top: 5px;">
 

   <el-option v-for="item in shipList"
              :key="item.value"
              :label="item.label"
              :value="item.value">
   </el-option>
 </el-select>
</template>
<script>
  export default {
    data() {
      return
 
 {
		input: '',
        shipList: [
          {
            value: '選項1',
            label: '1號'
          }, {
            value: '選項2',
            label: '2號'
          }, {
            value: '選項3',
            label: '3號'
          }, {
            value: '選項4',
            label: '4號'
          }
 
, {
            value: '選項5',
            label: '5號'
          }],
	}
   },
    methods: {
      selectBlur(e){
        this.input = e.target.value;
      },
      // 選擇船舶變化
      shipChange(val) {
        console.log("船隻變化");
        console.log(val);
      }
    }
  }
}
</script>