Files
element-plus/docs/examples/select/custom-template.vue
sea ade87f6729 docs(examples): standardize unified code format and fix some type (#16370)
* docs: standardize unified example code format and fix some example type

* docs:  update some example type

* Update docs/examples/descriptions/sizes.vue

Co-authored-by: kooriookami <38392315+kooriookami@users.noreply.github.com>

* docs: update example-page-header

* docs: update example-page-header

---------

Co-authored-by: kooriookami <38392315+kooriookami@users.noreply.github.com>
2024-04-15 16:29:21 +08:00

54 lines
924 B
Vue

<template>
<el-select v-model="value" placeholder="Select" style="width: 240px">
<el-option
v-for="item in cities"
:key="item.value"
:label="item.label"
:value="item.value"
>
<span style="float: left">{{ item.label }}</span>
<span
style="
float: right;
color: var(--el-text-color-secondary);
font-size: 13px;
"
>
{{ item.value }}
</span>
</el-option>
</el-select>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
const value = ref('')
const cities = [
{
value: 'Beijing',
label: 'Beijing',
},
{
value: 'Shanghai',
label: 'Shanghai',
},
{
value: 'Nanjing',
label: 'Nanjing',
},
{
value: 'Chengdu',
label: 'Chengdu',
},
{
value: 'Shenzhen',
label: 'Shenzhen',
},
{
value: 'Guangzhou',
label: 'Guangzhou',
},
]
</script>