SOURCE

class AutocompleteCellType extends GC.Spread.Sheets.CellTypes.Base {
    constructor(col) {
        super();
        this.column = col;
    }
    createEditorElement() {
        let input = document.createElement("input");
        input.id = "Autocomplete" + Vue.prototype.$$.newid();
        return input;
    }
    handleInput() {
        console.log(arguments);
    }
    activateEditor(editorContext) {
        this.vm = new ElementSelect({
            propsData: {
                column: this.column,
                value: "",
                handleInput: this.handleInput,
            },
        }).$mount(editorContext);
    }
    deactivateEditor(editorContext, context) {
        console.log(this.vm.$destroy);
        this.vm.$destroy();
        spreadNS.CellTypes.Base.prototype.deactivateEditor.call(this, editorContext, context);
    }
    setEditorValue(editorContext, value) {
        this.vm.value = value;
    }
    getEditorValue() {
        return this.vm.value;
    }
    updateEditor(editorContext, cellStyle, { width, height }) {
        this.vm.width = width;
        this.vm.height = height;
        console.log(this.vm);
    }
}

var ElementSelect = {
    template: ` <el-select :value="value" @input="handleInput" placeholder="请选择">
    <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
    </el-option>
  </el-select>`,
    props: {
        value: String,
        handleInput: Function
    },
    data() {
        return {
            options: [{
                value: '选项1',
                label: '黄金糕'
            }, {
                value: '选项2',
                label: '双皮奶'
            }, {
                value: '选项3',
                label: '蚵仔煎'
            }, {
                value: '选项4',
                label: '龙须面'
            }, {
                value: '选项5',
                label: '北京烤鸭'
            }],
        }
    }
}