iview 里面 select 模拟数据且有初始数据显示

代码如下：

<template>
    <Row>
        <Col span="5" style="padding-right:10px">
            <Select v-model="formAdd.model">
                <Option v-for="(item,index) in cityList" :value="item.value" :key="index">{{ item.label }}</Option>
            </Select>
        </Col>
        <button @click="sumit">提交</button>
    </Row>
</template>
<script>
    export default {
        data () {
            return {
                cityList: [],
                formAdd:{
                    model: '',
                }
            }
        },
        methods:{
            sumit(){
                console.log("ttt",this.formAdd.model)
            }
        },
        created(){
            // 模拟接口返回的数据
            var arr1 = [
                {value: '1',label: '2.4K'},
                {value: '2',label: '4.8K'},
                {value: '3',label: '9.6K'},
                {value: '4',label: '19.2K'},
            ];
            this.cityList = arr1;
            // value 就等于 id   label等于 name  显示在页面上的。
            this.formAdd.model = this.cityList[0].value;
        }
    }
</script>

打印的值就是传的值： this.formAdd.model  ；

还有一种取值方法：用@an-change 方法

<Select v-model="formAdd.model" @on-change="data_changes">
      <Option v-for="(item,index) in cityList" :value="item.value" :key="index">{{ item.label }}</Option>
</Select>


data_changes(data){
   console.log("data",data);
},

这是select选中不同的值，打印的结果：

最后为了方便大家的沟通与交流请加QQ群： 625787746

请进QQ群交流：【IT博客技术分享群①】：https://jq.qq.com/?_wv=1027&k=DceI0140