修配送单打印bug总结

[liyatang]

看代码找茬

    componentDidMount() {
        const query = this.props.location.query;

        actions.purchase_task_print(query).then(() => {
            const { printList } = this.props.purchase_task,
                len = printList.length;
            let { printIndex } = this.state;
            while (printIndex < len) {
                window.print();

                this.setState({
                    printIndex: printIndex + 1 === len ? len - 1 : printIndex + 1
                });

                printIndex++;
            }

            window.close();
        });
    }

1 这里假设了 setState 是同步，实际上却是是同步，但是代码上不应该做这样的依赖。万一UI没更新，下一轮 print 却打印上一次的界面就不太好了。 2 window.print 后 不应该立马 window.close ，见 https://stackoverflow.com/questions/6460630/close-window-automatically-after-printing-dialog-closes

二分法

当问题很难定位的时候可以逐步把问题的范围缩小，知道定位问题所在。常用的是二分法。比如 render 代码，缩减一半看看问题是否出现。

内网穿透

远程客户电脑用二分法没本地这么简单，客户访问的是外网。 又不可能把二分法部署到线上，不合理也麻烦。用内网穿透，本地起个服务，通过 ngrok 来穿透，客户就可直接访问本地的服务了。

• 下载 ngrok https://github.com/gmfe/Think/tree/master/tool
• 本地起服务，假设端口是8080
• ./ngrok http 8080
• 用上一步生成的链接访问即可

批量打印

上述代码，是打完一个项目又接着打另外一个，实际上不是很友好。 可以一次性打印的，有个css page-break-after: always; 可控制分页。