<p><code></p> <p>标准盒子模型:宽度=内容的宽度(content)+ border + padding + margin<br />低版本IE盒子模型:宽度=内容宽度(content+border+padding)+ margin</p> <p>box-sizing属性?</p> <p>用来控制元素的盒子模型的解析模式,默认为content-box<br />context-box:W3C的标准盒子模型,设置元素的 height/width 属性指的是content部分的高/宽<br />border-box:IE传统盒子模型。设置元素的height/width属性指的是border + padding + content部分的高/宽</p> <ol> <li><a href="http://www.js-code.com/tag/vue" title="Vue" target="_blank">Vue</a> 有哪些指令?</li> </ol> <p>v-bind(绑定,缩写成:)、v-show(<a href="http://www.js-code.com/tag/%e5%8f%8c%e5%90%91%e7%bb%91%e5%ae%9a" title="双向绑定" target="_blank">双向绑定</a>)、v-if、v-for、v-on(监听事件,缩写成@)等等</p> <ol> <li>v-if 和 v-show 有什么区别?</li> </ol> <p>v-show 仅仅控制元素的显示方式,将 display 属性在 block 和 none 来回切换;而v-if会控制这个 <a href="http://www.js-code.com/tag/dom" title="DOM" target="_blank">DOM</a> 节点的存在与否。当我们需要经常切换某个元素的显示/隐藏时,使用v-show会更加节省性能上的开销;当只需要一次显示或隐藏时,使用v-if更加合理。</p> <p>父组件通过 props 传值给子组件,子组件通过 $emit 给父组件传值</p> <p>vue生命周期的理解?<br />答:总共分为 8 个阶段创建前/后,载入前/后,更新前/后,销毁前/后。</p> <p>创建前/后: 在 beforeCreate 阶段,vue 实例的挂载元素 el 还没有。</p> <p>载入前/后:在 beforeMount 阶段,vue 实例的$el 和 data 都初始化了,但还是挂载之前为虚拟的 dom 节点,data.message 还未替换。在 mounted 阶段,vue 实例挂载完成,data.message 成功渲染。</p> <p>更新前/后:当 data 变化时,会触发 beforeUpdate 和 updated 方法。</p> <p>销毁前/后:在执行 destroy 方法后,对 data 的改变不会再触发周期函数,说明此时 vue 实例已经解除了事件监听以及和 dom 的绑定,但是 dom 结构依然存在</p> <p>vue路由传值使用params<br /><a href="http://www.js-code.com/tag/this" title="this" target="_blank">this</a>.$router.push({name: 'edit',params: {id: add}})</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: 0px; margin: 0px; padding: 0px; position: relative; visibility: visible; width: 697px; background-color: transparent;"><ins id="aswift_4_anchor" style="display: block; border: none; height: 0px; margin: 0px; padding: 0px; position: relative; visibility: visible; width: 697px; background-color: transparent; overflow: hidden; opacity: 0;"><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>ax<a href="http://www.js-code.com/tag/ios" title="ios" target="_blank">ios</a>({<br /> method: ’post’,<br /> url: ’/user/12345’,<br /> data: {</p> <div class="widget-codetool" style="display:none;"> <div class="widget-codetool--inner"> <span class="selectCode code-tool" data-toggle="tooltip" data-placement="top" title="" data-original-title="全选"></span><br /> <span type="button" class="copyCode code-tool" data-toggle="tooltip" data-placement="top" data-clipboard-text="firstName: ’Fred’, lastName: ’Flintstone’" title="" data-original-title="复制"></span> </div> </p></div> <pre class="hljs groovy"><code><span class="hljs-string">firstName:</span> ’Fred’, <span class="hljs-string">lastName:</span> ’Flintstone’</code></pre> <p>}<br />}).then(function(res){<br /> console.log(res);//处理成功的函数 相当于success<br />}).catch(function(error){<br /> console.log(error)//错误处理 相当于error<br />})</p> <p></code></p>

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