Vue.js 的起步和概览

作者: Arvin Chen 分类: vue 发布时间: 2018-11-03 17:40

Vue.js 应用都需要通过实例化 Vue 来实现。如下:

 
var vm = new Vue({
  // 选项
})

Vue.js 最核心的功能有两个,一是响应式的数据绑定系统,二是组件系统。重要的核心:

  • Vue.js响应式的数据绑定系统
  • Vue.js组件系统

Vue.js的实例化

vue.js的构造器在上面已经了解了,那么,看一下下面这个简单地例子来了解下vue.js的构造器需要哪些内容:

     提示:可以修改代码后运行

上面的例子,如果属性变化了,Vue 的响应式系统也能让html变化,如下:

     提示:可以修改代码后运行

除了上面的数据属性,Vue.js的实例属性与方法如下:

     提示:可以修改代码后运行

Vue.js响应的数据绑定

Vue.js 的起步和概览

响应式的数据绑定:数据发生改变->视图自动更新;忘记操作DOM这回事,专注于操作数据。可以看一下的简单Vue.js响应解析,更多的后面会详细来说:

     提示:可以修改代码后运行

Vue.js的组件系统

组件系统是 Vue.js 另一个重要概念,因为它提供了一种抽象,让我们可以用独立可复用的小组件来构建大型应用。如果我们考虑到这点,几乎任意类型的应用的界面都可以抽象为一个组件树:

Vue.js 的起步和概览

我们在Vue.js 的目录结构中有说到src/app.vue的目录结构了,下面看个例子简单解析一下这个组件功能:

     提示:可以修改代码后运行

  •   本文标题:Vue.js 的起步和概览 - Break易站
    转载请保留页面地址:https://www.breakyizhan.com/vue/6679.html
    扫描二维码添加微信 
  • ,领取淘宝优惠券,淘宝购物更优惠。现在添加微信,还可以领取机械键盘优惠券!添加微信后,分享淘宝选中的机械键盘给淘宝机器人即可领取!
    支持我们,就用微信淘宝!

    发表笔记

    电子邮件地址不会被公开。 必填项已用*标注

    更多阅读