选择列表

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

自由学三年,把想法变成现实。33 折优惠(最后 7 天), 现在订阅 →

在应用里面,先添加一个表示在选择列表里所选的项目的值 ... 名字可以是 selected ... 先让它等于一个空白的字符 .. 然后再添加一个数组,它可以是选择列表里的项目 ... 比如名字可以是 options ... 它是一个数组 .. 每个项目都是一个对象 .. 对象里可以有一些属性,添加一个 value 属性,它可以表示选择项目表示的值 ... 再添加两个这样的项目 ... 修改一下它们的 value 属性的值 ..

然后把 selected 的值绑定到这个元素的里面 ... 再去创建一个选择列表 .. 一组 select 标签 .. 上面添加几个 css 类 .. 在这个元素上给它绑定一个数组 ... 使用 v-model 这个指令 ... 数据的名字就是 selected .. 表示当前所选的项目的值 ..

每个选择列表项目都需要用一组 option 标签 ... 在这个元素上可以用一下 v-for 去创建一个列表 .. option in options ... 再给元素的 value 属性绑定一个值 ... 这个值就是 option.value ,选择列表项目里的 value 的值 ...

选择列表项目上显示的文字也可以用一下这个值 ...

回到浏览器 ... 打开这个选择列表 ... 选择一个项目 ... 当前选择的项目表示的值会作为绑定给 select 的那个数据的值 .. 我这里就是 selected 这个数据的值 ...

选择列表《 Vue.js 前端框架 》

统计

10670
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点