首页 > 其他分享 >直播平台搭建,使用element-ui中的select下拉框

直播平台搭建,使用element-ui中的select下拉框

时间:2023-09-21 14:11:10浏览次数:27  
标签:value label ui element 下拉框 select

直播平台搭建,使用element-ui中的select下拉框

话不多说,上代码:

 


 <el-select v-model="value" filterable placeholder="请选择">
     <el-option v-for="(item,index) in options" :key="index" :value="item.value" :label="label">   {{item.value}}</el-option>
  </el-select>

 js中写:

 


data(){
    return{
        options: [{
          value: '20人',
          label: 'type1'
        }, {
          value: '50人',
          label: 'type2'
        }, {
          value: '100人',
          label: 'type3'
        }, {
          value: '200人',
          label: 'type4'
        }, {
          value: '1000人',
          label: '选项5'
        }],
        value: '100人'
    }
}

 

 以上就是 直播平台搭建,使用element-ui中的select下拉框,更多内容欢迎关注之后的文章

 

标签:value,label,ui,element,下拉框,select
From: https://www.cnblogs.com/yunbaomengnan/p/17719830.html

相关文章

  • nodejs+vue+element-ui安装
    1.nodejs安装https://www.runoob.com/nodejs/nodejs-install-setup.html2.vue安装nodejs安装以后,使用vue会报错:‘vue‘不是内部或外部命令,也不是可运行的程序解决办法:https://developer.aliyun.com/article/1093401配置vue的环境变量:查看到prefix的值以后,分别......
  • RK3568开发笔记(十一):开发版buildroot固件移植一个ffmpeg播放rtsp的播放器Demo
    前言  目标开发任务还有个功能,就是播放rtsp摄像头,当然为了更好的坐这个个,我们必须支持rtsp播放失败之后重新尝试,比如5s重新尝试打开一次,从而保障联网后重新打开,然后达成这个功能。 Demo   补充  得益于方案上的buildroot已经移植了ffmpeg4.1.3。  ......
  • 解析vue项目,scoped,ref属性,混入mixin,插件,Elementui
    0解析一下vue项目......
  • nuitka 打包编译python3 脚本
    pipinstallordered-set#加速编译pipinstallnuitkapipinstallzstandard#onefile时压缩文件#打包命令python-mnuitka--mingw64--standalone--output-dir=out--show-progress--onefile--windows-disable-console--windows-icon-from-ico=1.ico--output-di......
  • Java学习之路--GUI编程06
    packagecom.gui.lesson06;importjavax.swing.*;importjava.awt.*;//2023.3.25/3.26GUI编程--下拉框学习(Combobox)//这个程序最终运行结果不美观,正常情况下下拉框我们放在一个面板里面再添加到容器中。这里就只是演示下拉框是什么样子publicclassTestComboboxDemo01extendsJ......
  • Java学习之路--GUI编程--贪吃蛇小游戏
    贪吃蛇小游戏界面实现四步走1.定义数据2.面板里将数据画上去3.监听事件键盘事件packagecom.gui.snake;importjavax.swing.*;importjava.net.URL;//2023.3.28GUI编程--贪吃蛇小游戏的实现--数据中心(只有一堆图片的数据)--贪吃蛇各个部分的导入--图片文件夹有两种导入......
  • Java学习之路--GUI编程03
    packagecom.gui.lesson03;importjava.awt.*;importjava.awt.event.KeyAdapter;importjava.awt.event.KeyEvent;//2023.3.20GUI编程--键盘监听学习publicclassTestKeyListener{publicstaticvoidmain(String[]args){newKeyFrame();}}//键盘监听类cla......
  • Java学习之路--GUI编程04
    packagecom.gui.lesson04;importjavax.swing.*;importjava.awt.*;importjava.awt.event.ActionEvent;importjava.awt.event.ActionListener;//2023.3.21GUI编程--dialog(弹窗)学习publicclassDialogDemoextendsJFrame{publicDialogDemo(){this.setVisibl......
  • Java学习之路--GUI编程05
    packagecom.gui.lesson05;importjavax.swing.*;importjava.awt.*;importjava.net.URL;//2023.3.24GUI编程--Swing--JButton按钮学习publicclassJButtonDemo01extendsJFrame{publicJButtonDemo01(){Containercontainer=this.getContentPane();//Contain......
  • Java学习之路--GUI编程02
    packagecom.gui.lesson02;importjava.awt.*;importjava.awt.event.*;//2023.3.14GUI编程--事件监听学习事件监听---actionListener生成一个窗口-内置一个按钮--点击按钮输出内容,点击关闭关闭窗口publicclassTestActionEvent{publicstaticvoidmain(String[]args)......