我的学习日志(十二)

[shimuash]

1. 当v-for和v-if一起使用的时候，v-for 的优先级比 v-if 更高，这意味着 v-if 将分别重复运行于每个 v-for 循环中，可以使用如下解决方案

<template v-if="shouldRenderTodos">
  <li v-for="todo in todos">
    {{ todo }}
  </li>
</template>

2. 做聊天应用，每次发完消息，消息容器自动滚动到底部，可以使用watch监听数据的变化

 watch: {
    messages () {
      this.$nextTick(() => {
        const { chatMessage } = this.$refs
        chatMessage.scrollTop = chatMessage.scrollHeight
      })
    }
  }