@@ -12,9 +12,9 @@ Vue.js(读音 /vjuː/,类似于 **view**) 是一套构建用户界面的**
12
12
13
13
## 起步
14
14
15
- <p class =" tip " >官方教程假设你已有 HTML、CSS 和 JavaScript 中级前端知识。如果你是全新的前端开发者 ,将框架作为你的第一步可能不是最好的主意——掌握好基础知识再来!之前有其他框架的使用经验是有帮助的,但不是必需的 。</p >
15
+ <p class =" tip " >官方指南假设你已有 HTML、CSS 和 JavaScript 中级前端知识。如果你刚开始学习前端开发 ,将框架作为你的第一步可能不是最好的主意——掌握好基础知识再来!之前有其他框架的使用经验对于学习 Vue.js 是有帮助的,但这不是必需的 。</p >
16
16
17
- 尝试 Vue.js 最简单的方法是使用 [ JSFiddle Hello World 例子] ( https://jsfiddle.net/chrisvfritz/50wL7mdz/ ) 。你可以在浏览器新标签页中打开它,跟着我们学习一些基础示例 。或者你也可以创建一个本地的 ` .html ` 文件,然后通过如下方式引入 Vue:
17
+ 尝试 Vue.js 最简单的方法是使用 [ JSFiddle Hello World 例子] ( https://jsfiddle.net/chrisvfritz/50wL7mdz/ ) 。你可以在浏览器新标签页中打开它,跟着例子学习一些基础用法 。或者你也可以创建一个本地的 ` .html ` 文件,然后通过如下方式引入 Vue:
18
18
19
19
``` html
20
20
<script src =" https://unpkg.com/vue/dist/vue.js" ></script >
@@ -54,7 +54,7 @@ var app = new Vue({
54
54
</script >
55
55
{% endraw %}
56
56
57
- 我们已经生成了我们的第一个 Vue 应用!看起来这跟单单渲染一个字符串模板非常类似,但是 Vue 在背后做了大量工作。现在数据和 DOM 已经被绑定在一起,一切都是 ** 响应式的** 。我们如何知道?打开浏览器的 JavaScript 控制台 ,并修改 ` app.message ` ,你将看到上面渲染的例子相应地更新了 。
57
+ 我们已经生成了我们的第一个 Vue 应用!看起来这跟单单渲染一个字符串模板非常类似,但是 Vue 在背后做了大量工作。现在数据和 DOM 已经被绑定在一起,所有的元素都是 ** 响应式的** 。我们如何知道?打开你的浏览器的控制台(就在这个页面打开) ,并修改 ` app.message ` ,你将看到上例相应地更新 。
58
58
59
59
除了文本插值,我们还可以采用这样的方式绑定 DOM 元素属性:
60
60
@@ -177,7 +177,7 @@ var app4 = new Vue({
177
177
178
178
## 处理用户输入
179
179
180
- 为了让用户和你的应用进行交互 ,我们可以用 ` v-on ` 指令绑定一个调用 Vue 实例方法的事件监听器 :
180
+ 为了让用户和你的应用进行互动 ,我们可以用 ` v-on ` 指令绑定一个事件监听器,通过它调用我们 Vue 实例中定义的方法 :
181
181
182
182
``` html
183
183
<div id =" app-5" >
@@ -218,9 +218,9 @@ var app5 = new Vue({
218
218
</script >
219
219
{% endraw %}
220
220
221
- 注意在 ` reverseMessage ` 方法中,我们更新了应用的状态,但没有触碰 DOM - 所有的 DOM 操作都由 Vue 来处理,你编写的代码只需要关注底层逻辑。
221
+ 注意在 ` reverseMessage ` 方法中,我们更新了应用的状态,但没有触碰 DOM—— 所有的 DOM 操作都由 Vue 来处理,你编写的代码只需要关注底层逻辑。
222
222
223
- Vue 还提供了 ` v-model ` 指令,使表单输入和应用状态间的双向绑定变得轻而易举 。
223
+ Vue 还提供了 ` v-model ` 指令,它能轻松实现表单输入和应用状态之间的双向绑定 。
224
224
225
225
``` html
226
226
<div id =" app-6" >
@@ -364,7 +364,7 @@ var app7 = new Vue({
364
364
365
365
## 准备好了吗?
366
366
367
- 我们刚才简单介绍了 Vue 核心最基本的功能 - 本教程的其余部分将涵盖这些功能以及其他高级功能更详细的细节,所以请务必读完整个教程!
367
+ 我们刚才简单介绍了 Vue 核心最基本的功能—— 本教程的其余部分将涵盖这些功能以及其他高级功能更详细的细节,所以请务必读完整个教程!
368
368
369
369
***
370
370
0 commit comments