Vue的基础理解(五)
<h4>自定义v-model是怎么实现的？</h4>
<p>v-model实质上是v-on和v-bind的语法糖，用来在表单控件或组件上创建双向绑定；</p>
<pre><code><input v-model='searchText'>
等价于
<input
v-bind:value='searchText'
v-on:input='searchText = $event.target.value'></code></pre>
<p>在一个组件上使用v-model，默认会为组件绑定名为value的prop和名为input的事件</p>
<hr />
<h4>Vuex和单纯的全局对象有什么区别？</h4>
<ul>
<li>
<p>单纯的全局变量：调试将会变为噩梦，任何时间，我们应用的任何部分，在任何数据改变后，都不会留下变更的记录，也就是可以随意更改,而且<strong>没有留下任何记录,后期项目会无法维护</strong>。</p>
</li>
<li>vuex中所有的状态更新的唯一方式都是提交mutation，异步操作需要通过action来提交mutation（dispatch）。这样使得我们可以<strong>方便地跟踪每一个状态的变化</strong>，从而让我们能够实现一些工具帮助我们更好地使用vuex；</li>
</ul>
<hr />
<h4>为什么vuex的mutation中不能做异步操作？</h4>
<ul>
<li>
<p>vuex中所有的状态更新的唯一方式都是提交mutation，异步操作需要通过action来提交mutation（dispatch）。这样使得我们可以方便地跟踪每一个状态的变化，从而让我们能够实现一些工具帮助我们更好地使用vuex;</p>
</li>
<li>
<p>每个mutation执行完后都会对应得到一个新的状态变更.</p>
</li>
<li>如果mutation支持异步操作，就没有办法知道状态是何时更新，无法很好的进行状态追踪，影响调试效率.</li>
</ul>
<h4>v-show 和 v-if有什么区别？</h4>
<ul>
<li>v-show 只是基于css进行切换，不管什么条件都会进行渲染。（display:block|none;）</li>
<li>v-if 条件不成立就不会渲染当前节点的DOM,</li>
</ul>
<p>总结：v-if 的切换开销比较大，v-show的初始化开销比较大，所以在需要频繁显示和隐藏的情况下使用v-show,渲染后很少进行切换则使用v-if更适合。</p>