View Select的一些问题

<template>
    <Row>
      {{model18}}
      ------------
      {{cityList4 || model18}}
        <Col span="12">
            <Select v-model="model18" filterable multiple>
                <Option v-for="item in (cityList4 || model18)" :value="item" :key="item.value">{{ item.label }}</Option>
            </Select>
        </Col>
    </Row>
</template>
<script>
    export default {
        data () {
            return {
                cityList4: null,
                model18: [{
                        value: 'New York2',
                        label: 'New York2'
                    }]
            }
        },
        methods: {
        },
        mounted () {
          let that = this
            setTimeout(() => {
              that.cityList4 = [
                    {
                        value: 'New York2',
                        label: 'New York2'
                    },
                    {
                        value: 'London',
                        label: 'London'
                    },
                    {
                        value: 'Canberra',
                        label: 'Canberra'
                    }
                ]
              // 不生效 [...that.model18, {value: 'Canberra', label: 'Canberra'}]
              // 不生效 JSON.parse(JSON.stringify(that.cityList4.slice(0, 2)))
              // 不生效  that.cityList4.filter(c => that.model18.map(m => m.value).includes(c.value))
              // 生效  that.cityList4.filter(c => !that.model18.map(m => m.value).includes(c.value))
              // 生效 that.model18 = [...that.cityList4.slice(0, 2), {value: '', label: ''}]
                that.model18 = that.cityList4.slice(0, 2) // 
                console.log('model18888 ', that.model18)
              
            }, 2000)
          }
    }
</script>