iview

.babelrc

{ "presets": [ ["env", { "modules": false }], "stage-2" ], "plugins": ["transform-runtime"], "env": { "test": { "presets": ["env", "stage-2"], "plugins": ["transform-vue-jsx", "transform-runtime",["import", { "libraryName": "iview", "libraryDirectory": "src/components" }]] } }}

sortMethod: (a, b, type) => type === 'asc' ? a.age > b.age : a.age < b.age

a:比较的第一值​ b:比较的第二个值​ type:非常重要的值,desc倒序 asc顺序

autocomplete组件按需加载时,报错 transfer,只要在AutoComplete 上加上 transfer就可以了,此时 transfer为true,不加默认就是false

```

//表格页代码


//autoTableWidth文件代码,是一个公共方法

export default {

    methods: {

        _autoTableWidth(columns) {

            if(columns && columns.length){

                if (this.$el.getElementsByClassName('ivu-table-header') && this.$el.getElementsByClassName('ivu-table-header').length){

                    let tTD = {}; // 缓存当前操作TH

                    let headerTable = this.$el.getElementsByClassName('ivu-table-header')[0].getElementsByTagName('TABLE')[0];

                    let headerColgroup = headerTable.getElementsByTagName('colgroup')[0];

                    let bodyTable = this.$el.getElementsByClassName('ivu-table-body')[0].getElementsByTagName('TABLE')[0];

                    let bodyColgroup = bodyTable.getElementsByTagName('colgroup')[0];

                    let fixIndexs = [];

                    // let fixWidth='60px'

                    let maxResizeWidth = 240;

                    columns.forEach((c, i) => {

                        if (['index', 'selection', 'expand'].some(s => s === c.type)) {

                            fixIndexs.push(i);

                            // headerColgroup.children[i].style.width=fixWidth

                            // bodyColgroup.children[i].style.width=fixWidth

                        }

                    });

                    Array.prototype.slice.call(headerTable.rows[0].cells, 0).forEach((e, i) => {

                        if (fixIndexs.some(s => s === i)) {

                            return;

                        }

                        e.onmousedown = (event) => {

                            if (event.target.nodeName === 'TH' && event.offsetX > event.target.offsetWidth - 6) {

                                tTD.mouseDown = true;

                                tTD.oldX = event.x;

                                tTD.oldWidth = event.target.offsetWidth;

                                tTD.index = i;

                                tTD.minResizeWidth = event.target.getElementsByClassName('ivu-table-cell')[0].offsetWidth + 2;

                            }

                        };

                        e.onmouseup = () => {

                            tTD.mouseDown = false;

                            tTD.oldWidth = tTD.newWidth;

                        };

                        document.onmouseup = () => {

                            tTD.mouseDown = false;

                            tTD.oldWidth = tTD.newWidth;

                        };

                        e.onselectstart = () => {

                            return false;

                        };

                        e.onmousemove = (event) => {

                            event.preventDefault();

                            // 更改鼠标的样式

                            if (event.target.nodeName === 'TH' && event.offsetX > event.target.offsetWidth - 6 || tTD.mouseDown) {

                                event.target.style.cursor = 'col-resize';

                            } else {

                                event.target.style.cursor = 'default';

                            }

                            // 调整宽度

                            if (tTD.mouseDown) {

                                tTD.newWidth = tTD.oldWidth + (event.x - tTD.oldX);

                                tTD.newWidth = tTD.newWidth < tTD.minResizeWidth ? tTD.minResizeWidth : tTD.newWidth;

                                tTD.newWidth = tTD.newWidth > maxResizeWidth ? maxResizeWidth : tTD.newWidth;

                                headerColgroup.children[tTD.index].width = tTD.newWidth;

                                bodyColgroup.children[tTD.index].width = tTD.newWidth;

                            }

                        };

                    });

                }

            }

        }

    }

};


//main.js中引入,全局共用,下面引用路径是我项目的,大家自己改

import autoTableWidth from "@/components/common/mixins/autoTableWidth";


Vue.mixin(autoTableWidth);

```

你可能感兴趣的:(iview)