组件


1.DefSteps

image.png

<DefSteps :steps="stepList" :cur-step="curstep"></DefSteps>

参数 说明 类型 默认值
steps 所有步骤 Array [ ]
cur-step 当前步骤 Number 0

steps = [

  { name: '提交订单', time: '2019-03-29 16:00:31' },

  { name: '支付订单', time: '2019-03-29 16:00:32' },

  { name: '买家成团', time: ''},

  { name: '平台发货', time: '' },

  { name: '确认收货', time: '' },

  { name: '订单完成', time: '' }

]

2.SelectList

image.png

<SelectList :selectList="selectList"  @selectChange="selectChange" type='single'></SelectList>

参数 说明 类型 可选值 默认值
selectList 所有选项 Array - [ ]
selectChange 选中项改变时,触发的方法 function - -
type 类型(单选or多选) String "single" or "multiple" "single"

selectList=[

        { name: '全部订单', num: 0, type: '', selected: true },

        { name: '待付款', num: 0, type: '0' },

        { name: '待发货', num: 0, type: '1' },

        { name: '已发货', num: 0, type: '2' },

        { name: '售后中', num: 0, type: '3' },

        { name: '已关闭', num: 0, type: '4' },

        { name: '已取消', num: 0, type: '5' },

        { name: '已完成', num: 0, type: '6' }

      ],

selectList 数组传入格式:

参数 说明 类型
name 选项名称 String
num 显示数值 number
type 相当于id,可根据需要自行定义该字段 -
selected 选中项 boolean
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 作为一个合格的开发者,不要只满足于编写了可以运行的代码。而要了解代码背后的工作原理;不要只满足于自己的程序...
    六个周阅读 8,548评论 1 33
  • 1 .使用dayjs这个三方库,得出来的月份,星期日都是从0开始的。所以这些地方都要重点照顾,天是对的。2 .v-...
    skoll阅读 452评论 0 0
  • 目前github上已经有将Quill封装一层的vue-quill-editor,对于使用Vue且想直接用Quill...
    minxuan阅读 3,492评论 3 1
  • 此文基于官方文档,里面部分例子有改动,加上了一些自己的理解 什么是组件? 组件(Component)是 Vue.j...
    陆志均阅读 3,883评论 5 14
  • 昨天(大年初六)下午母亲要从老家出发乘坐去宜昌的火车了,母亲去给弟弟带孩子。我给母亲预约了滴滴快车,但父亲坚持...
    曾被遗忘的美丽阅读 540评论 5 13