<p><code></p> <p>1、jquery:将ajax的success,cmop<a href="http://www.js-code.com/tag/let" title="let" target="_blank">let</a>e,error等方法进行封装,通过{}大括号的对象入口,进行调用。 var option = {}; option.success = function(res){} option.validate = function() {return true;}</p> <p>2、图表:根据ajax的json数据,hightcharts接口,生成线图、饼图、柱形图、雷达图等</p> <p>3、VUE:基于vue-cli的工程化开发,数据<a href="http://www.js-code.com/tag/%e5%8f%8c%e5%90%91%e7%bb%91%e5%ae%9a" title="双向绑定" target="_blank">双向绑定</a>,模版组件化,开发后台通过路由识别,解决传统后台的iframe和后端路由的配置。</p> <p>vue全家桶:<a href="http://www.js-code.com/tag/vue" title="Vue" target="_blank">Vue</a>+<a href="http://www.js-code.com/tag/vue" title="Vue" target="_blank">Vue</a>-router+<a href="http://www.js-code.com/tag/vue" title="浏览关于“Vue”的文章" target="_blank" class="tag_link">Vue</a>x+ax<a href="http://www.js-code.com/tag/ios" title="ios" target="_blank">ios</a>, 通过<a href="http://www.js-code.com/tag/promis" title="Promis" target="_blank">Promis</a>e封装axiso,vuex的store管理action,getter,state,mutation, acton负责用户的请求转发,state负责设置变量,getter负责获取变量,mutation负责赋值给state里边的变量和sessionStorage本地存储。</p> <p>mapGetters, mapActions等相关map函数,负责页面的模块注入。</p> <p><a href="http://www.js-code.com/tag/this" title="this" target="_blank">this</a>.$router.push:通过path跳转路由,query浏览器地址栏传参。</p> <p><a href="http://www.js-code.com/tag/this" title="this" target="_blank">this</a>.$route.query: 获取地址栏的?号传参</p> <p><a href="http://www.js-code.com/tag/this" title="浏览关于“this”的文章" target="_blank" class="tag_link">this</a>.$route.name; 获取当前路由的名称, 可以打印this.$route对象。</p> <p>vue生命周期:beforeCreate created beforeMount mounted mounted updated beforeDestroy ,使用watch监听变量的变化</p> <p>beforecreated:el 和 data 并未初始化 <br />created:完成了 data 数据的初始化,el没有<br />beforeMount:完成了 el 和 data 初始化 <br />mounted :完成挂载</p> <div class="google-auto-placed ap_container" style="text-align: center; width: 100%; height: auto; clear: none;"><ins data-ad-format="auto" class="adsbygoogle adsbygoogle-noablate" data-ad-client="ca-pub-6330872677300335" data-adsbygoogle-status="done" style="display: block; margin: auto; background-color: transparent;"><ins id="aswift_4_expand" style="display:inline-table;border:none;height:175px;margin:0;padding:0;position:relative;visibility:visible;width:697px;background-color:transparent;"><ins id="aswift_4_anchor" style="display:block;border:none;height:175px;margin:0;padding:0;position:relative;visibility:visible;width:697px;background-color:transparent;"><iframe width="697" height="175" frameborder="0" marginwidth="0" marginheight="0" vspace="0" hspace="0" allowtransparency="true" scrolling="no" allowfullscreen="true" onload="var i=this.id,s=window.google_iframe_oncopy,H=s&amp;&amp;s.handlers,h=H&amp;&amp;H[i],w=this.contentWindow,d;try{d=w.document}catch(e){}if(h&amp;&amp;d&amp;&amp;(!d.body||!d.body.firstChild)){if(h.call){setTimeout(h,0)}else if(h.match){try{h=s.upd(h,i)}catch(e){}w.location.replace(h)}}" id="aswift_4" name="aswift_4" style="left:0;position:absolute;top:0;border:0px;width:697px;height:175px;"></iframe></ins></ins></ins></div> <p>beforecreate : 举个栗子:可以在这加个loading事件 <br />created :在这结束loading,还做一些初始化,实现函数自执行 <br />mounted : 在这发起后端请求,拿回数据,配合路由钩子做一些事情<br />beforeDestroy: 你确认删除XX吗? destroyed :当前组件已被删除,清空相关内容</p> <p>4、element-ui: 是vue组件的具体化,整合了常用的页面布局,包括表单,表格、弹窗、loading、图标icon,分页等。有自己的el标签语法和validate校验方式等,风格的后台类似Bootstrap以前的外观。</p> <p></code></p>

本文固定链接: http://www.js-code.com/vue-js/vue-js_26482.html