# toolbar组件 * * * tool bar 组件 ### 基本用法 * tool bar 组件 * 图标依赖于iconfont字体库 ~~~html <script> export default{ data () { return { buttonListData: [ { authName: '新建', operationType: 'create', datas: { authId: '3434965240233480124', viewId: '-5986396426325309878' } }, { authName: '修改', operationType: 'update', datas: { authId: '-2974825467645112856', viewId: '-5986396426325309878' } }, { authName: '批量刷新', operationType: 'batchFresh', datas: { isDoTrigger:"0" } }, { authName: '批量修改', operationType: 'batchUpdate', datas: null }, ] } }, methods: { buttonEvent(){ console.log(arguments) } } } </script> <div class=" demo-block"> <cap4-tool-bar :buttonListData="buttonListData" @buttonEvent="buttonEvent"></cap4-tool-bar> </div> ~~~ ### Attributes | 参数 | 说明 | 类型 | 可选值 | 默认值 | | --- | --- | --- | --- | --- | | buttonListData | button列表 (必填)) | Array | — | — | | buttonEvent | 事件回调 | Function | — | — | ### buttonListData | 参数 | 说明 | 类型 | 可选值 | 默认值 | | --- | --- | --- | --- | --- | | authName | 显示label | String | — | — | | datas | 传入的data | Object | — | — | | operationType | button type (必填) | String | create/update/batchUpdate/batchFresh/delete/lock/unlock/importAndExport/query/statistics/print/viewLog | — | ### Event | 事件名称 | 说明 | 回调参数 | | --- | --- | --- | | buttonEvent | 点击事件回调 | callBackArr, viewBid, authBid, name | ### buttonEvent回调args | 参数 | 说明 | 类型 | 可选值 | 默认值 | | --- | --- | --- | --- | --- | | callBackArr | 点击类型 | Array | — | — | | viewBid | viewId | Number | — | — | | authBid | authId | Number | — | — | | name | 按钮label | String | — | — |