vue.js是一套构建用户界面的渐进式框架

vue关注视图层,采用自底向上增量开发的设计

<div id="app">
<p>{{ message }}</p>
</div>

vue.js安装

下载 vue.min.js 并用

npm install vue
cd my-project
npm install
npm run dev
# 全局安装 vue-cli
$ cnpm install --global vue-cli
# 创建一个基于 webpack 模板的新项目
$ vue init webpack my-project
# 这里需要进行一些配置,默认回车即可
This will install Vue 2.x version of the template. For Vue 1.x use: vue init webpack#1.0 my-project
# 全局安装 vue-cli
$ cnpm install --global vue-cli
# 创建一个基于 webpack 模板的新项目
$ vue init webpack my-project
# 这里需要进行一些配置,默认回车即可
$ cd my-project
$ cnpm install
$ cnpm run dev
DONE Compiled successfully in 4388ms > Listening at http://localhost:8080

目录结构:

build 项目构建(webpack)相关代码

config 配置目录

node_modules npm 加载的项目依赖模块

static 静态资源目录

test 初始测试目录

package.json 项目配置文件

通过实例化Vue实现:

var vm = new Vue({
// 选项
})
{{ }} 用于输出对象属性和函数返回值

var vm = new Vue({
el: '#vue_det',
data: data
}) document.write(vm.$data === data) // true
document.write("<br>")
document.write(vm.$el === document.getElementById('vue_det')) // true

请点赞!因为你的鼓励是我写作的最大动力!

吹逼交流群:711613774

(3)打鸡儿教你Vue.js的更多相关文章

  1. (29)打鸡儿教你Vue.js

    web阅读器开发 epub格式的解析原理 Vue.js+epub.js实现一个简单的阅读器 实现阅读器的基础功能 字号选择,背景颜色 有上一页,下一页的功能 设置字号,切换主题,进度按钮 电子书目录 ...

  2. (26)打鸡儿教你Vue.js

    weex框架的使用 1.weex开发入门 2.weex开发环境搭建 3.掌握部分weex组件模块 4.了解一些vue基本常见语法 5.制作一个接近原生应用体验的app weex介绍 安装开发环境 We ...

  3. (22)打鸡儿教你Vue.js

    vue.js 单页面,多页面 Vue cli工具 复杂单页面应用Vue cli工具 交互设计,逻辑设计,接口设计 代码实现,线上测试 git clone,git int 创建分支,推送分支,合并分支 ...

  4. (21)打鸡儿教你Vue.js

    组件化思想: 组件化实现功能模块的复用 高执行效率 开发单页面复杂应用 组件状态管理(vuex) 多组件的混合使用 vue-router 代码规范 vue-router <template> ...

  5. (19)打鸡儿教你Vue.js

    了解vue2.x的核心技术 建立前端组件化的思想 常用的vue语法 vue-router,vuex,vue-cli 使用vue-cli工具 Vue框架常用知识点 vue核心技术 集成Vue 重点看,重 ...

  6. (18)打鸡儿教你Vue.js

    介绍一下怎么安装Vue.js vue.js Vue 不支持 IE8 及以下版本,因为 Vue 使用了 IE8 无法模拟的 ECMAScript 5 特性. Vue.js是一个渐进的,可逐步采用的Jav ...

  7. (17)打鸡儿教你Vue.js

    vue-router <a class="list-group-item" v-link="{ path: '/home'}">Home</a ...

  8. (15)打鸡儿教你Vue.js

    组件化vue.js 组件单向绑定 组件双向绑定 组件单次绑定 创建组件构造器 注册组件 使用组件 Vue.extend() Vue.component() 使用组件 <div id=" ...

  9. (13)打鸡儿教你Vue.js

    一小时复习 vue.js是一个JavaScriptmvvm库,是以数据驱动和组件化的思想构建的,相比angular.js,vue.js提供了更加简洁,更加容易理解的api,如果习惯了jquery操作d ...

  10. (12)打鸡儿教你Vue.js

    组件 语法格式如下: Vue.component(tagName, options) <tagName></tagName> <div id="app" ...

随机推荐

  1. Ajax跨越请求失败,解决

    跨越请求 1.1什么是跨域(两个不同系统之间的访问.调用) (1)域名不同,即两个不同的应用. (2)域名相同,但是端口不同,即同一个应用中的不同子系统. 1.2 Ajax跨域请求的缺陷 (1)创建t ...

  2. UOJ220 [NOI2016] 网格 【割顶】【并查集】

    题目分析: 答案显然只有{-1,0,1,2}四种. 对于答案等于-1的情况,只有两种情况,一种是只剩一只跳蚤,另一种是只剩两只跳蚤且他们四连通,这个很好判. 对于答案等于0的情况,那说明联通块大于1, ...

  3. 怎样重启ssh服务

    尝试下面两个命令: service sshd restart systemctl restart sshd.service

  4. ASP.NET Core 2.1 中的 HttpClientFactory (Part 1) HttpClientFactory介绍

    原文:https://www.stevejgordon.co.uk/introduction-to-httpclientfactory-aspnetcore  发表于:2018年1月 ASP.NET ...

  5. 编写Postgres扩展之五:代码组织和版本控制

    原文:http://big-elephants.com/2015-11/writing-postgres-extensions-part-v/ 编译:Tacey Wong 在关于编写Postgres扩 ...

  6. JavaScript常用节点类型

    一.常用节点类型: nodeType:节点类型 nodeName:节点名称 nodeValue:节点值 1.查看节点类型(控制台操作): 获取元素:var p = document.getElemen ...

  7. FI-TCODE收集

    主数据:FS00         编辑总帐科目FS01         创建主记录FS02         更改主记录FS03         显示主记录FS04         总帐科目更改(集中地 ...

  8. Linux如何监控每个进程所消耗流量

    查看整个系统的网卡流量使用情况 可以参考下这篇总结比较全面的文章 监控具体的某个进程所消耗的流程 首先,Linux没有自带这样的工具,通过这款第三方开源工具,也是比较好用,如果有其他的办法欢迎留言 # ...

  9. Linux之python3编译安装

    一,前言 centos7默认是装有python的,咱们先看一下 [root@glh ~ 20:18:03]#python Python 2.7.5 (default, Jul 13 2018, 13: ...

  10. LB_Kim

    LB_Kim 搜了一圈发现居然很少有博客说到这个东西, LB_Kim, 就是Kim设计的 下界函数 计算公式: LB_Kim(S,C)=MAX(i=1,2,3,4) d(∮(i)A,∮(i)C) em ...