Vue的基础理解(五)

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更适合。