<template>
    <div class="ht-base-select-icon-demo">
        <ht-base-select v-model="model15" style="width:200px">
            <ht-base-icon type='LiRa_home' slot="prefix" color="#333333"></ht-base-icon>
            <ht-base-option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</ht-base-option>
        </ht-base-select>
        <ht-base-select v-model="model15" style="width:200px">
            <ht-base-avatar src="https://i.loli.net/2017/08/21/599a521472424.jpg" slot="prefix" size="small"/>
            <ht-base-option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</ht-base-option>
        </ht-base-select>
    </div>
</template>

<script>
  export default {
    name: 'HtBaseSelectIconDemo',
    data () {
      return {
        cityList: [
          {
            value: 'New York',
            label: 'New York'
          },
          {
            value: 'London',
            label: 'London'
          },
          {
            value: 'Sydney',
            label: 'Sydney'
          },
          {
            value: 'Ottawa',
            label: 'Ottawa'
          },
          {
            value: 'Paris',
            label: 'Paris'
          },
          {
            value: 'Canberra',
            label: 'Canberra'
          }
        ],
        model15: ''
      }
    }
  }
</script>
<style>
    .ht-base-select-icon-demo {

    }
</style>

