(3)打鸡儿教你Vue.js
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的更多相关文章
- (29)打鸡儿教你Vue.js
web阅读器开发 epub格式的解析原理 Vue.js+epub.js实现一个简单的阅读器 实现阅读器的基础功能 字号选择,背景颜色 有上一页,下一页的功能 设置字号,切换主题,进度按钮 电子书目录 ...
- (26)打鸡儿教你Vue.js
weex框架的使用 1.weex开发入门 2.weex开发环境搭建 3.掌握部分weex组件模块 4.了解一些vue基本常见语法 5.制作一个接近原生应用体验的app weex介绍 安装开发环境 We ...
- (22)打鸡儿教你Vue.js
vue.js 单页面,多页面 Vue cli工具 复杂单页面应用Vue cli工具 交互设计,逻辑设计,接口设计 代码实现,线上测试 git clone,git int 创建分支,推送分支,合并分支 ...
- (21)打鸡儿教你Vue.js
组件化思想: 组件化实现功能模块的复用 高执行效率 开发单页面复杂应用 组件状态管理(vuex) 多组件的混合使用 vue-router 代码规范 vue-router <template> ...
- (19)打鸡儿教你Vue.js
了解vue2.x的核心技术 建立前端组件化的思想 常用的vue语法 vue-router,vuex,vue-cli 使用vue-cli工具 Vue框架常用知识点 vue核心技术 集成Vue 重点看,重 ...
- (18)打鸡儿教你Vue.js
介绍一下怎么安装Vue.js vue.js Vue 不支持 IE8 及以下版本,因为 Vue 使用了 IE8 无法模拟的 ECMAScript 5 特性. Vue.js是一个渐进的,可逐步采用的Jav ...
- (17)打鸡儿教你Vue.js
vue-router <a class="list-group-item" v-link="{ path: '/home'}">Home</a ...
- (15)打鸡儿教你Vue.js
组件化vue.js 组件单向绑定 组件双向绑定 组件单次绑定 创建组件构造器 注册组件 使用组件 Vue.extend() Vue.component() 使用组件 <div id=" ...
- (13)打鸡儿教你Vue.js
一小时复习 vue.js是一个JavaScriptmvvm库,是以数据驱动和组件化的思想构建的,相比angular.js,vue.js提供了更加简洁,更加容易理解的api,如果习惯了jquery操作d ...
- (12)打鸡儿教你Vue.js
组件 语法格式如下: Vue.component(tagName, options) <tagName></tagName> <div id="app" ...
随机推荐
- Delphi XE10.1 引用计数(Delphi XE10.1 Berlin终于增加了对接口的Weak, UnSafe的支持)
以往的Delphi版本,不支持接口的Weak,和UnSafe的引用,支持对象的Weak, UnSafe,而且仅在Android和Ios平台上支持. 现在Delphi XE10.1 Berlin终于增加 ...
- 怎样在python中写注释
python中的注释是以井号: # 开头, 一般会在#后加一个空格. # This is a comment print("Hello, World!") 多行注释的语法是三引号: ...
- Spring Cloud Alibaba学习笔记(1) - 整合Spring Cloud Alibaba
Spring Cloud Alibaba从孵化器版本毕业:https://github.com/alibaba/spring-cloud-alibaba,记录一下自己学习Spring Cloud Al ...
- DropDownList下拉控件
<asp:DropDownList ID="DropDownList1" runat="server" Width="177px" ...
- 写在NOIP2018前
不知不觉距离NOIP2018还有两天,两个月的停课生活即将结束 此时心里总感觉装着许多话,想要将其倾诉却发现连哪怕一句也凝结不出 只觉得这两月像是场荒诞的冒险,好像我想做的什么都做了,又感觉我其实一事 ...
- 后端参数校验器v1.0(调用一个方法校验所有参数并得到校验结果,且包括错误原因)
一:介绍 在写后端时,面对多个参数,比如手机号码.密码等我们常常需要写验证逻辑,当需要验证的参数较多的时候我们会需要写很多的判断语句,这就造成了大量的代码冗余.因此我开发了一套参数验证器,只需要调用参 ...
- PLSQL Developer新建表空间
转自:https://www.cnblogs.com/juddhu/archive/2012/03/20/2408499.html 通过pl/sql登录到Oracle数据库上,然后执行菜单:文件/新建 ...
- Jerry带您了解Restful ABAP Programming模型系列之三:云端ABAP应用调试
Jerry的Restful ABAP Programming模型介绍系列的前两篇文章: 30分钟用Restful ABAP Programming模型开发一个支持增删改查的Fiori应用 Jerry带 ...
- 我是怎么和SAP结缘的 - Jerry的SAP校园招聘之路
2006年9月,结束了一年的北京中科院实习后,我回到了电子科技大学,此时已经是研三上学期了.有着"金九银十"之称的秋季校园招聘正式开始了. 准备好了简历后,Jerry也加入了浩浩荡 ...
- shell 大型脚本工具开发实战
拆分脚本功能,抽象函数 1.function get_all_group 返回进程组列表字符串 2.function get_all_process 返回进程名列表字符串"nginx htt ...