1. 为什么vue被称为“渐进框架”？
使用渐进式框架的代价很小，从而使现有项目（使用其他技术构建的项目）更容易采用并迁移到新框架。 vue.js 是一个渐进式框架，因为你可以逐步将其引入现有应用，而不必从头开始重写整个程序。
vue 的最基本和核心的部分涉及“视图”层，因此可以通过逐步将 vue 引入程序并替换“视图”实现来开始你的旅程。
由于其不断发展的性质，vue 与其他库配合使用非常好，并且非常容易上手。这与 angular.js 之类的框架相反，后者要求将现有程序完全重构并在该框架中实现。
2. vue.js 中的声明式渲染是什么？
vue.js 使渲染数据变得容易，并隐藏了内部实现。例如下面的代码：
html
<p id=”app”></p>javascript
const greeting = “hello there!”;const appp = document.getelementbyid(“app”);appp.innertext = greeting;上面的代码段将在 id 为 “app” 的 p 中显示短语 “hello there！”。代码包含实现结果所需的所有步骤。首先选择 id 为 “app” 的 dom 元素，然后用 innertext 属性手动设置 p 的内容。
现在，让我们看看在 vue 中是怎么做的。
template
<p id=”app”>{{ greeting }}</p>app
new vue({ data: { greeting: ‘hello there!’ }, el: ‘#app’});我们在 vue 程序中创建了一个名为 “greeting” 的数据属性，但是只需要在 p 中用 mustache 语法输入 “greeting” 即可，而不必关心内部实现。我们声明了 “greeting” 变量，其余的由 vue 完成。这就是声明式渲染的样子。 vue 隐藏并管理内部信息。
3. 你用哪个指令遍历对象的属性？
要遍历对象或数组，可以使用 v-for 指令。下面是一个例子：
template
<p id="app"> <ul> <li v-for="(value, key) in card">{{ key }} - {{ value }}</li> </ul> </p>app
new vue({ el: '#app', data: { card: { name: 'john doe', age: 25, city: 'new york', country: 'us' } }});输出
name – john doeage – 25city – new yorkcountry – us4. 给出模板，描述 vue 程序的输出。
模板：
{{title}}app:
new vue({ el: '#app', data: { title: 'vue.js' } })上面的代码将在 p 中输出字符串 <h1 style="color: green;">vue.js</h1>。之所以将整个标签渲染为字符串，是因为 mustache 模板标签 {{title}}将传入的数据视为字符串，而不将其解析为可执行代码。这也有助于缓解把恶意代码注入到页面的 xss 相关的问题 。这类似于在 javascript 中使用 elementselector.innertext = text 语句。
5. 如何在输入框和数据属性之间实现双向数据绑定？
要实现双向数据绑定，可以使用 v-model 指令。 v-model 指令主要是语法糖：
<input type="text" :value="nameinput" @keyup="nameinput = $event.target.value">在上面的语句中，每当观察到 “keyup” 事件时，就会将名为 “nameinput” 的数据属性设置为输入框的值。同时，将输入框的 value 属性绑定到 “nameinput” 数据属性。这样在表单字段和数据属性之间建立了双向数据关系。
v-model 可以做到这一点，并且比手动设置更有效地。要使用 v-model 复制上述效果，请再次在同一输入框中输入以下内容：
<input type="text" v-model="nameinput">需要注意的是，当实现双向数据绑定时，使用的数据属性被认为是事实上的来源。在 data 属性上所做的任何更改都将优先于 form 字段上的用户输入事件。
6. 你如何捕获元素上的点击事件？
可以使用 v-on:click 指令捕获 click 事件。该指令也可以用缩写符号 @click 表示。这是一个例子：
v-on:click 符号
<a v-on:click=”clickhandler”>launch!</a>@click 符号
<a @click=”clickhandler”>launch!</a>7. 什么是动态 prop？
当使用 v-bind 指令为 prop 分配值作为绑定到属性的函数时，被称为动态 prop。例如以下组件的 tweet 属性绑定到名为tweettext的数据属性。这与静态硬编码值相反。这种绑定始终是单向的，这意味着数据可以从父组件流到子组件，而绝不会反过来。
<tweetbox :tweet=”tweettext”>8. vue.js 中的指令是什么？
指令是一系列特殊属性，你可以通过将其添加到模板 html 标记中来赋予它们特殊的响应功能。指令允许模板中的元素使用数据属性、方法、计算或监视的属性和内联表达式根据定义的逻辑对更改做出反应。例如以下代码使用 v-on 指令在组件上实现 click 事件侦听器。
<signupbutton v-on:click=”dosignup” />或者
<signupbutton @click=”dosignup” />在这个例子中，我们使用 v-if 指令基于名为 showbutton 的数据属性显示或删除元素与组件。指令以 v- 开头来指示 vue 特定的属性。此规则的例外是 v-on 和 v-bind 的简写形式。
<signupbutton v-if=”showbutton” />vue 还允许定义自己的自定义指令。
9. v-show 指令的用途是什么？
v-show 指令允许有条件地显示元素。在下面的代码中，仅当 isdisplayed 数据属性为 true 时，才会显示该元素。
<tweetbox v-show=”isdisplayed”>使用 v-show 指令时，可使用 css 的 display 属性切换元素的可见性。
10. v-show 与 v-if 指令有何不同？
v-show 和 v-if 都用于有条件地显示元素，而后者提供了条件渲染的真正实现。 v-show 只需切换 css 的 display 属性即可显示或隐藏元素，而 v-if 指令可创建或销毁组件。每次显示状态更改时，代价通常会更大。
另一方面，v-show 成本较低，因为它仅切换元素的css显示属性。所以如果必须经常切换元素，则 v-show 会提供比 v-if 更好，更优化的结果。
就加载元素的初始渲染成本而言，v-if 不会渲染最初隐藏的元素的节点，而 v-show 会渲染其 css display 属性被设置为 none 的元素。
11. 对于作为元素实现的注释框，我们希望使用户能够按下键盘上的enter键，来将内容提交给名为 “storecomment” 的方法。在代码中对此进行演示。
可以在任何元素上使用 v-on 指令来实现事件侦听器。此外，v-on 还允许我们将按键修饰符用于 “enter”，“tab”，“esc”，“space” 等常见按键。这是一个例子：
模板
<textarea @keyup.enter="storecomment"></textarea>app
new vue({ el: '#app', methods: { storecomment(event) { //access the value of the textarea box using event.target.value or