摘要：
函数是十分优雅的语言特性，它让我们可以采用可复用的方式存储一段逻辑，从而不用重复代码就可以多次使用这一逻辑。在Vue的模板里，函数被定义为方法来使用。只要将一个函数存储为methods对象的一个属性，就可以在模板中使用它： <!DOCTYPE html> <html lang="en"> <head 阅读全文
摘要：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv 阅读全文
摘要：
不能使用v-bind:value——使用v-bind只会在inputValue值变化时才更新输入框的值，反过来则不行。作为替代，可以使用v-model指令，它作用于输入框元素，将输入框的值绑定到data对象的对应属性上，因此输入框不但会接收data上的初始值，而且当输入内容更新时，data上的属性值 阅读全文
摘要：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv 阅读全文
摘要：
除了在一开始创建HTML, Vue还监控data对象的变化，并在数据变化时更新DOM。 让我们创建一个用于显示当前时间的页面，每隔一秒获取一下当前时间： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name 阅读全文
摘要：
v-bind，可以接收参数。v-bind指令用于将一个值绑定到一个HTML属性上。 下面的这个例子将http://www.baidu.com的值绑定到href上： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta 阅读全文
摘要：
另外一个我经常使用的指令是v-for，这个指令通过遍历一个数组或者对象，将指令所在的元素循环输出到页面上。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="wi 阅读全文
摘要：
区别： v-if指令的值为假，那么这个元素不会被插入DOM。 和v-show指令比较一下，该指令使用CSS样式控制元素的显示/隐藏。 <!-- 以下代码会输出 <div>one</div> --> <div v-if="ture">one</div> <div v-if="false">two</d 阅读全文
摘要：
Vue的核心是将数据显示在页面上，这一功能通过模板实现。为正常的HTML添加特殊的属性——被称作指令——借助它来告诉Vue我们想要实现的效果以及如何处理提供给它的数据。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <m 阅读全文
摘要：
安装Vue不需要任何特殊的工具，使用下面的代码就可以实现： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initia 阅读全文
摘要：
如果不使用框架，项目最终会成为一团不可维护的代码，而绝大部分代码所要处理的工作，框架都已经为我们抽象出来了。以下面两段代码为例，它们都实现了同样的功能：使用Ajax下载一个列表数据并在页面上显示。其中，第一段使用jQuery实现，而第二段使用Vue实现。 使用jQuery的代码: 这段代码执行了以下 阅读全文