KboneAPI部分bug修改

在使用KboneAPI时发现了很多BUG，于是着手修改源码

showModal数据不会刷新的问题

查看源码后发现内部的show方法仅做了修改display的操作，并没有对用户传入的数据做出相应的相应，所以会导致第二次调用时，传入数据无效，模态框使用的还是老数据。

修改方案：

src / interaction / modal.ts

给show方法添加重置模态框参数的方法resetOptions：

 resetOptions(params = {
    
    }) {
    
    
        const options = Object.assign({
    
    }, this.params, params);   
        this.contentTag.textContent = options.content;
        this.titleTag.textContent = options.title;
        this.confirmTag.textContent = options.confirmText;
        this.cancelTag.textContent = options.cancelText;
        this.confirmTag.onclick = () => {
    
    
            options.success({
    
    
                confirm: true,
                cancel: false
            })
            options.complete({
    
    
                confirm: true,
                cancel: false
            })
            this.resolveHandler({
    
    
                confirm: true,
                cancel: false
            })
            this.hide()
        } 
        this.cancelTag.onclick = () => {
    
    
            options.success({
    
    
                confirm: false,
                cancel: true
            })
            options.complete({
    
    
                confirm: false,
                cancel: true
            })
            this.resolveHandler({
    
    
                confirm: false,
                cancel: true
            })
            this.hide()
        }
    }

然后在修改show方法：

    show(params = {
    
    }) {
    
     
        if (!this.preStyleTag) {
    
    
            this.preAppendStyles()
        } 
        if (!this.wrapper) {
    
    
            const options = Object.assign(
                {
    
    }, this.params, params
            )
            this.render(options)
        }else{
    
    
            //刷新模态框
            this.resetOptions(params);
        }
        this.wrapper.style.display = "block";
        return new Promise((resolve) => {
    
    
            this.resolveHandler = resolve
        })
    }

即可

给showToast添加Error

使用showToastAPI发现没有error，于是给他添加一个：

src / interaction / toast.ts

//62行添加
 errorIcon = {
    
    
        color: "#fff",
        width: "55px",
        height: "55px",
        display: "block",
        "mask-image": "url(data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M12%2010.586l5.657-5.657%201.414%201.414L13.414%2012l5.657%205.657-1.414%201.414L12%2013.414l-5.657%205.657-1.414-1.414L10.586%2012%204.929%206.343%206.343%204.93%2012%2010.586z%22%20fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E)",
        "-webkit-mask-image": "url(data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M12%2010.586l5.657-5.657%201.414%201.414L13.414%2012l5.657%205.657-1.414%201.414L12%2013.414l-5.657%205.657-1.414-1.414L10.586%2012%204.929%206.343%206.343%204.93%2012%2010.586z%22%20fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E)",
        "vertical-align": "middle",
        "-webkit-mask-position": "50% 50%",
        "mask-position": "50% 50%",
        "-webkit-mask-repeat": "no-repeat",
        "mask-repeat": "no-repeat",
        "-webkit-mask-size": "100%",
        "mask-size": "100%",
        "background-color": "currentColor",
    }
//172行添加(第一个Switch)
switch (options.icon) {
    
    
    case "success":
        this.icon.setAttribute("style", processCss(this.successIcon))
        break;
    case "loading":
        this.icon.setAttribute("style", processCss(this.loadingIcon))
        break;
    case "error":
        this.icon.setAttribute("style",processCss(this.errorIcon))
        break;
    case "none":
        this.icon.style.display = "none"
        break
    default:
        break
}
//233行添加(第二个Switch)
switch (options.icon) {
    
    
    case "success":
        this.icon.setAttribute("style", processCss(this.successIcon))
        break
    case "loading":
        this.icon.setAttribute("style", processCss(this.loadingIcon))
        break
    case "error":
        this.icon.setAttribute("style",processCss(this.errorIcon))
        break;
    case "none":
        this.icon.style.display = "none"
        break
    default:
        break
}

使用showActionSheet出现的BUG

使用showActionSheet时，如果在两次调用传入不同长度的数组，多次点击就会出现数组乱序问题，修改源码如下：

src / interaction / actionsheet.ts第186行修改：

if (this.cells.length > itemList.length) {
    
    
    for (let index = this.cells.length - 1; index <= itemList.length; index++) {
    
    
        this.menuTag.removeChild(this.cells[index])
    }
    this.cells.splice(itemList.length)
}

即可解决。