vue简介

vue是什么

vue是一门构建用户界面的渐进式的js框架

vue特点

• 组件化，提高代码复用率，且更好维护
• 声明式编码，让程序员无需直接操作DOM，提高开发效率

<!--  有个容器 -->
<ul class="demo-box"><ul>
<!-- 比如我们有数据 -->
<script>
  let data = [
    {
      id: 1
      name: '苹果',
    },
    {
      id: 2,
      name: '香蕉',
    }
    {
      id: 3,
      name: '橘子',
    }
  ]
  // 现在想要把这些数据循环
  // 命令式编码
  let htmlStr = '' // 准备字符串
  let box = document.getElementByClassName('demo-box')
  data.forEach(item => {
    htmlStr += `<li>item.id + item.name</li>`
  })
  box.innerHTML = htmlStr

// 声明式
<ul>
  <li v-for="item in data">
    {{ item.name }}
  </li>
</ul>
</script>

• 虚拟dom+diff算法，提高性能

比如我们有一组数据，首先把数据转为虚拟dom，最后把虚拟dom又转为真实dom;当数据发生变化的时候，我们采用diff算法，采取新旧虚拟dom的对比，把新的虚拟dom又追加到原来的真实dom上
具体了解：v-for中key的作用