Vue的基础理解(五)

<input v-model="searchText">

等价于

<input
    v-bind:value="searchText"
    v-on:input="searchText = $event.target.value">

在一个组件上使用v-model，默认会为组件绑定名为value的prop和名为input的事件

Vuex和单纯的全局对象有什么区别？

• 单纯的全局变量：调试将会变为噩梦，任何时间，我们应用的任何部分，在任何数据改变后，都不会留下变更的记录，也就是可以随意更改,而且没有留下任何记录,后期项目会无法维护。

• vuex中所有的状态更新的唯一方式都是提交mutation，异步操作需要通过action来提交mutation（dispatch）。这样使得我们可以方便地跟踪每一个状态的变化，从而让我们能够实现一些工具帮助我们更好地使用vuex；

为什么vuex的mutation中不能做异步操作？

• vuex中所有的状态更新的唯一方式都是提交mutation，异步操作需要通过action来提交mutation（dispatch）。这样使得我们可以方便地跟踪每一个状态的变化，从而让我们能够实现一些工具帮助我们更好地使用vuex;

• 每个mutation执行完后都会对应得到一个新的状态变更.

• 如果mutation支持异步操作，就没有办法知道状态是何时更新，无法很好的进行状态追踪，影响调试效率.

v-show 和 v-if有什么区别？

• v-show 只是基于css进行切换，不管什么条件都会进行渲染。（display:block|none;）
• v-if 条件不成立就不会渲染当前节点的DOM,

总结：v-if 的切换开销比较大，v-show的初始化开销比较大，所以在需要频繁显示和隐藏的情况下使用v-show,渲染后很少进行切换则使用v-if更适合。