首先，动态加载数据

     
 　　……省略
          
       
               
股票代码
                   
                   
          
          
               
交易日期
               
               
          
      
     
     

　　

vue-data:

　　　　　　dataG: {            zijinfenpei: 0,//资金分配            zijinfenshu: 0,//资金分数            jizhunjiage: 0,//基准价格            meibijiaoyijine: 0,//每笔交易金额            jiaoyifeilv: 0,//交易费率            dicangbili: 0,//底仓比例            shangzhangxiaxian: 0,//上涨下跌用一个            qujianshangxian: 0,//区间上限            qujianxiaxian: 0,//区间下限            zijinyue: 0,//资金余额            zhengquanshizhi: 0,//证券市值            zichanzongzhi: 0,//资产总值            chigubudong: 0,//持股不动            qujianjiaoyizhihou: 0,//区间交易之后            tongqidapan: 0,//同期大盘            gaopaobishu: 0,//高抛笔数            dixibishu: 0,//低吸笔数            zhengquanshuliang: 0,//证券数量            jiaoyichengben: 0,//交易成本            zengshoujine: 0//增收金额        },        pageData: [//交易结果数据包--格式                        {                stockCode: '--',//股票代码                count: "--",//交易数量                qujianjiage: '--',//区间价格                date: '--',//交易时间                jiaoyileixing: 1,//交易类型 1=买入 2=卖出                gaodiguaidian: '--',//高低拐点                price: '--'//交易价格            },           {               stockCode: '--',//股票代码               count: "--",//交易数量               qujianjiage: '--',//区间价格               date: '--',//交易时间               jiaoyileixing: '--',//交易类型 1=买入 2=卖出               gaodiguaidian: '--',//高低拐点               price: '--'//交易价格           },        ],        pageIndex: [[0, 1]],//存储分页组数的下标数据包        pageI: 0,//分页数据下标

vue-fn:

pageRecord: function (data) {//交易记录            //console.log(data) //打印数据包                        var thas = this, dataArr = data, lenght_ = data.length, arr = [];//公用变量            thas.pageData = [];//清空数据包开始写入数据            for (i in data) {                var data_arr = data[i];                thas.pageData.push({                    stockCode: data_arr.code,                    count: data_arr.count,                    date: data_arr.date,                    qujianjiage: data_arr.chufajia,                    jiaoyileixing: data_arr.buyOrSel,                    gaodiguaidian: data_arr.gaodi,                    price: data_arr.price                })            }            thas.pageIndex = [];//清空            for (var i = 0; i < lenght_; i++) {                arr.push(i)            }            function arrSlice(arr, num) {                var arr1 = [];                for (var i = 0; i < arr.length / num; i++) {                    arr1.push(arr.slice(num * i, num * i + num))                }                return arr1;            }            thas.pageIndex = arrSlice(arr, 2) //将数组弄成下标分组            //console.log(thas.pageIndex)            //测试数量分页               thas.page_index();            //JyJl.page_index();还有一个其他的分页        },        page_index: function () {            laypage({ //这个分页空间用的是layui框架的                cont: 'page_1'                , pages: Math.ceil(fXjg.pageData.length / 2)                , groups: 5                , first: false                , last: false                , skin: "#01AAED"                , jump: function (obj, first) {                    //console.log(obj.curr)//下标                    fXjg.pageI = ((obj.curr) - 1);                }            });        }    }

　　事件驱动当然是有某一个按钮之类的请求了ajax，拿到数据后，在成功回调函数里使用了这个fxjg.pageRecord(data);

vue的数据双向绑定让我们省去了很多很多代码，如果是用jqueryDom操作的话，这点代码根本不行。