看文档真的是一件非常快乐的事情，看别人写的代码，再跟自己写的代码一对比，立刻会发现有很多不同的地方，也可以学到很多新技能，从最简单的阅读学习起来，今天看的是select下拉框相关的。
资料相关
星星指数：star:55k
基础用法：
1：当返回值是对象数组的时候
仔细观察，可以看到以上的例子中，包括在文档中所有涉及到数据渲染的地方，返回值全部都是这种形式，对象数组
[{ value: '选项1', label: '黄金糕' }, { value: '选项2', label: '双皮奶' }, { value: '选项3', label: '蚵仔煎' }, { value: '选项4', label: '龙须面' }, { value: '选项5', label: '北京烤鸭' }]
select下拉框赋值，当返回值是对象数组的时候
渲染的时候只需要用v-for循环遍历数组，取出数组中的对象的值就行了
<template> <el-select v-model="value" placeholder="请选择"> <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option> </el-select> </template> <script> export default { data() { return { options: [{ value: '选项1', label: '黄金糕' }, { value: '选项2', label: '双皮奶' }, { value: '选项3', label: '蚵仔煎' }, { value: '选项4', label: '龙须面' }, { value: '选项5', label: '北京烤鸭' }], value: '' } } } </script>
2：当返回值是字符串数组的时候
当返回值options的数据格式是这样的时候,v-for循环options数组，是key,value直接等于item即可。
options: [ '黄金', '白银', '铂金', '钻石', ],
<template> <el-select v-model="value" placeholder="请选择"> <el-option v-for="item in options" :key="item" :value="item"> </el-option> </el-select> </template> <script> export default { data() { return { options: [ '黄金', '白银', '铂金', '钻石', ], value: '' } } } </script>
