luckysheet 新增自定义工具栏

项目中需要在工具中自定义一个工具栏,具备导入导出功能,直接上步骤
1、找到路径为src/local/zh.js的文件,找到打印,后面新增importExcel: “导入”
在这里插入图片描述
2、找到路径为src/controllers/toobar.js的文件
找到defaultToolbar,追加importExcel
在这里插入图片描述
找到toolbarIdMap ,追加 importExcel: ‘#luckysheet-icon-importExcel’
在这里插入图片描述
找到createToolbarHtml,追加html

 importExcel: `<div class="luckysheet-toolbar-button-split-left luckysheet-toolbar-button luckysheet-inline-block"
        data-tips="${toolbar.importExcel}" id="luckysheet-icon-importExcel" role="button" style="user-select: none;">
            <div class="luckysheet-toolbar-button-outer-box luckysheet-inline-block"
            style="user-select: none;">
                <div class="luckysheet-toolbar-menu-button-inner-box luckysheet-inline-block"
                style="user-select: none;">
                    <div class="luckysheet-toolbar-menu-button-caption luckysheet-inline-block"
                    style="user-select: none;">
                        <div class="luckysheet-icon luckysheet-inline-block " style="user-select: none;">
                            <div aria-hidden="true" class="luckysheet-icon-img-container luckysheet-icon-img luckysheet-icon-rotation-none iconfont luckysheet-iconfont-biaogesuoding"
                            style="user-select: none;">
                            <!--限制上传格式为xls和xslx-->
                             <input id="luckysheet-excelUpload" type="file" accept="application/vnd.ms-excel,application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" style="display:none;"></input>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>` // 'importExcel'

4、找到路径为src/controllers/menuButton.js的文件,追加事件

//importExcel
        $("#luckysheet-icon-importExcel").click(function(){
            $("#luckysheet-excelUpload").click()
        })
        $("#luckysheet-excelUpload").click(function(e){
            e.stopPropagation()
        })
        $("#luckysheet-excelUpload").on('change',function(e){
            let file = e.currentTarget.file[0]
            window.excelUpload(file)
        })

5、最后npm run build 即可

  • 11
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值