【阅读笔记】Vue 官方文档 - 简介 - Vue 是什么

文章来源: 什么是Vue?

Vue 具有两个主要特征：声明式渲染、响应性
让我们看个例子： 当按钮被点击时，按钮中的数字增加 1

使用 Vue 的写法如下:

js
复制代码
<div id="app"> 
   <button @click="count++"> 
      Count is: {{ count }} 
   </button>
</div>

声明式渲染： 我们可以采用类似 模板字符串 的形式来编写内容，如例子中的 Count is: {{ count }}( count 是一个变量 )

响应性： 当数据状态改变时，Vue 自动 更新 DOM 内容。本例中 count 就是我们的数据，当 count 的数值增加 1 时，count 的状态就发生了改变。我们可以对比下原生 JavaScript 的写法：

<div id="app">
   <button onclick="updateCount()">
      Count is: <span></span>
   </button>
</div>

<script>
    let count = 0
    const countContainer = document.querySelector('#app span');
    countContainer.textContent = count;
    
    function updateCount() {
       count++;
       countContainer.textContent = count;
    }  
</script>

可见，声明式渲染 是依赖于 响应性 的