首页 > 其他分享 >vue el-cascader

vue el-cascader

时间:2024-03-14 09:45:33浏览次数:21  
标签:picker el vue value label 选择器 cascader children

 


      <!-- 选择商品属于哪个内目 -->       <el-form-item label="选择分类" style="margin: 0 0 20px 0;">         <el-cascader           v-model="form.types"           :options="form.typesoptions"           @change="handleChange"></el-cascader>       </el-form-item>     typesoptions: [{           value: 'zhinan',           label: '指南',           children: [{             value: 'shejiyuanze',             label: '设计原则',             children: [{               value: 'yizhi',               label: '一致'             }, {               value: 'fankui',               label: '反馈'             }, {               value: 'xiaolv',               label: '效率'             }, {               value: 'kekong',               label: '可控'             }]           }, {             value: 'daohang',             label: '导航',             children: [{               value: 'cexiangdaohang',               label: '侧向导航'             }, {               value: 'dingbudaohang',               label: '顶部导航'             }]           }]         }, {           value: 'zujian',           label: '组件',           children: [{             value: 'basic',             label: 'Basic',             children: [{               value: 'layout',               label: 'Layout 布局'             }, {               value: 'color',               label: 'Color 色彩'             }, {               value: 'typography',               label: 'Typography 字体'             }, {               value: 'icon',               label: 'Icon 图标'             }, {               value: 'button',               label: 'Button 按钮'             }]           }, {             value: 'form',             label: 'Form',             children: [{               value: 'radio',               label: 'Radio 单选框'             }, {               value: 'checkbox',               label: 'Checkbox 多选框'             }, {               value: 'input',               label: 'Input 输入框'             }, {               value: 'input-number',               label: 'InputNumber 计数器'             }, {               value: 'select',               label: 'Select 选择器'             }, {               value: 'cascader',               label: 'Cascader 级联选择器'             }, {               value: 'switch',               label: 'Switch 开关'             }, {               value: 'slider',               label: 'Slider 滑块'             }, {               value: 'time-picker',               label: 'TimePicker 时间选择器'             }, {               value: 'date-picker',               label: 'DatePicker 日期选择器'             }, {               value: 'datetime-picker',               label: 'DateTimePicker 日期时间选择器'             }, {               value: 'upload',               label: 'Upload 上传'             }, {               value: 'rate',               label: 'Rate 评分'             }, {               value: 'form',               label: 'Form 表单'             }]           }, {             value: 'data',             label: 'Data',             children: [{               value: 'table',               label: 'Table 表格'             }, {               value: 'tag',               label: 'Tag 标签'             }, {               value: 'progress',               label: 'Progress 进度条'             }, {               value: 'tree',               label: 'Tree 树形控件'             }, {               value: 'pagination',               label: 'Pagination 分页'             }, {               value: 'badge',               label: 'Badge 标记'             }]           }, {             value: 'notice',             label: 'Notice',             children: [{               value: 'alert',               label: 'Alert 警告'             }, {               value: 'loading',               label: 'Loading 加载'             }, {               value: 'message',               label: 'Message 消息提示'             }, {               value: 'message-box',               label: 'MessageBox 弹框'             }, {               value: 'notification',               label: 'Notification 通知'             }]           }, {             value: 'navigation',             label: 'Navigation',             children: [{               value: 'menu',               label: 'NavMenu 导航菜单'             }, {               value: 'tabs',               label: 'Tabs 标签页'             }, {               value: 'breadcrumb',               label: 'Breadcrumb 面包屑'             }, {               value: 'dropdown',               label: 'Dropdown 下拉菜单'             }, {               value: 'steps',               label: 'Steps 步骤条'             }]           }, {             value: 'others',             label: 'Others',             children: [{               value: 'dialog',               label: 'Dialog 对话框'             }, {               value: 'tooltip',               label: 'Tooltip 文字提示'             }, {               value: 'popover',               label: 'Popover 弹出框'             }, {               value: 'card',               label: 'Card 卡片'             }, {               value: 'carousel',               label: 'Carousel 走马灯'             }, {               value: 'collapse',               label: 'Collapse 折叠面板'             }]           }]         }, {           value: 'ziyuan',           label: '资源',           children: [{             value: 'axure',             label: 'Axure Components'           }, {             value: 'sketch',             label: 'Sketch Templates'           }, {             value: 'jiaohu',             label: '组件交互文档'           }]         }]         }

标签:picker,el,vue,value,label,选择器,cascader,children
From: https://www.cnblogs.com/z360519549/p/18072128

相关文章

  • vueusejs实现拖动
    https://www.vueusejs.com/guide/ npmi-D@vueuse/nuxt@vueuse/corepnpmadd-D@vueuse/nuxt@vueuse/core定义变量constcontentParent=ref();定义div<divclass="lg:flexoverflow-autoh-6/6w-[calc(100%+1rem)]"ref=&quo......
  • Rust的Cell、RefCell和OnceCell:灵活且安全的内部可变性
    这一系列文章的创作目的主要是帮助我自己深入学习Rust,同时也为已经具备一定Rust编程经验,但还没有深入研究过语言和标准库的朋友提供参考。对于正在入门Rust的同学,我更建议你们看《Rust圣经》或者《TheBook》,而不是这种晦涩难懂的文章。终于拿到了某量化公司的offer,继续系列文......
  • R语言风险价值:ARIMA,GARCH模型,Delta-normal法滚动估计,预测VaR(Value at Risk)和回测分析
    原文链接:http://tecdat.cn/?p=24492原文出处:拓端数据部落公众号介绍此分析的目的是帮助客户构建一个过程,以在给定时变波动性的情况下正确估计风险价值。风险价值被广泛用于衡量金融机构的市场风险。我们的时间序列数据包括1258天的股票收益。为了解释每日收益率方差的一小部......
  • R语言使用灰色关联分析(Grey Relation Analysis,GRA)中国经济社会发展指标
    原文链接:http://tecdat.cn/?p=16881原文出处:拓端数据部落公众号 灰色关联分析包括两个重要功能。第一项功能:灰色关联度,与correlation系数相似,如果要评估某些单位,在使用此功能之前转置数据。第二个功能:灰色聚类,如层次聚类。 灰色关联度灰色关联度有两种用法。该算法用于测量......
  • Vite+Vue3打包性能优化 Gzip压缩
    安装插件npmivite-plugin-compression-D配置文件//vite.config.tsimportviteCompressionfrom'vite-plugin-compression';exportdefault()=>{return{plugins:[viteCompression({threshold:10240,//设置只有大于10kb的......
  • Vue — Vuex模块
    目的:由于Vuex使用的是单一状态树,所有的应用状态都会集中到一个比较大的对象。所以我们拆分store,每一个组件的store创建一个单独的模块,便于维护。1.创建modules文件夹 2.配置子模块conststate={userInfo:{name:'巧克力的雨天',age:9,......
  • 中考英语首字母快速突破005-2021上海虹口英语二模-Overcoming Labels to Save a Frien
    PDF格式公众号回复关键字:ZKSZM005原文​OnedaySamandJerryweregoinghomefromschool.Whenonturningacorner,Samcriedout,“Afight!Letusgoandsee!”​“No,”saidJerry,“letusgoquietlyhome!Wehavenothingtodowith......
  • Vue中怎么使用router进行页面传参
    在响应式编程中,使用VueRouter传递参数通常涉及到以下几个方面:1.动态路由匹配动态路由匹配允许你根据URL中的参数来渲染不同的组件。这在显示用户信息、博客文章等需要根据ID或其他标识符来区分内容的情况下非常有用。例如,如果你想根据用户ID显示不同的用户信息......
  • Masked Self-Attention(掩码自注意力机制)
    2024.3.13MaskedSelf-Attention(掩码自注意力机制)自注意力机制自注意力机制计算单词相似度时,已经明确知道这句话有多少个单词,而掩码则是分批次给,最后一次给全为什么要做这个改进:生成模型,生成单词,是一个个生成的当我们做生成任务的是时候,我们也想对生成的这个单词做注意力......
  • Self-Attention相比较RNN和LSTM的优缺点
    2024.3.13Self-AttentionSelf-Attention相比较RNN和LSTM的优缺点RNN基本单元结构无法做长序列,当一段话达到50个字,效果就很差了复杂度为n的平方$X_0$往后面越传播,信息越少(如你爷爷的爷爷的爷爷的名字)LSTM基本结构LSTM通过各种门,遗忘门,选择性的可以记忆之前的信息(200词)Se......