vue的主要内容

1.了解vue

2.vue开发环境的搭建和脚手架工具的使用

3.vue具体的指令和项目实战

  1.了解vue

    1.具备基础:html、css、js,模块化概念、ES6语法(简单即可)

    2.特点: vue吸收了react和angular的优点

    3.vue的一个组件:template---------->html

          script-------------->js

          style--------------->css

    4.vue文件的后缀名是.vue

  2.vue开发环境的搭建和脚手架工具的使用

    1.vue开发环境的搭建-npm/cnpm命令行安装     

 # 全局安装 vue-cli
$ npm install -g vue-cli
# 创建一个基于 "webpack" 模板的新项目
$ vue init webpack my-project
# 安装依赖,走你
$ cd my-project
$ npm install
$ npm run dev

    2.vue.js的重要组件

      1.data

      2.methods

      3.watch

      4.模板指令-html和vue对象的粘合剂

        数据渲染---->v-text,v-html,{{}}

        控制模块隐藏--->v-if,v-show---值是布尔值,区别是v-if直接不渲染,而v-show通过display:none隐藏

        渲染循环列表--->v-for

        事件绑定------->v-on:click="",简写@click=""

        属性绑定------->v-bind,例如v-bind:src="",简写:src="",:class="{}",:class="[]"

    【总结】

      1. new一个vue对象的时候你可以设置它的属性,其中最重要的包括三个,分别data,methods,watch。

      2.data代表vue对象的数据,methods代表vue对象的方法,watch设置了对象监听的方法。

      3.vue对象里的设置通过html指令进行关联  

      4.重要的指令包括

         v-text[渲染数据]、v-if[控制显示]、v-on[绑定事件]、v-for[循环渲染]等。

vue.js主要内容的更多相关文章

  1. Vue.js安装使用教程

    一.说明 上大学前,请的都是前端JavaScript.后端ASP/PHP/JSP.前后端代码混杂:上大学时,请的都是前端Jquery.后端SSH.前后端代码分离通过模板关联:大学出来后,请的都是前端三 ...

  2. 一个基于Vue.js+Mongodb+Node.js的博客内容管理系统

    这个项目最初其实是fork别人的项目.当初想接触下mongodb数据库,找个例子学习下,后来改着改着就面目全非了.后台和数据库重构,前端增加了登录注册功能,仅保留了博客设置页面,但是也优化了. 一.功 ...

  3. 学习Vue.js需要了解的部分内容

    重要: 1.如果要通过js/模板引用 图片到项目,图片路径需要使用require. 2.$event: $event 等于$emit 抛出的值,还可以使用$event.target.value. $e ...

  4. Vue.js 和 MVVM 小细节

    MVVM 是Model-View-ViewModel 的缩写,它是一种基于前端开发的架构模式,其核心是提供对View 和 ViewModel 的双向数据绑定,这使得ViewModel 的状态改变可以自 ...

  5. Vue.js 2.0 和 React、Augular等其他框架的全方位对比

    引言 这个页面无疑是最难编写的,但也是非常重要的.或许你遇到了一些问题并且先前用其他的框架解决了.来这里的目的是看看Vue是否有更好的解决方案.那么你就来对了. 客观来说,作为核心团队成员,显然我们会 ...

  6. 从Vue.js窥探前端行业

    近年来前端开发趋势 1.旧浏览器逐渐淘汰,移动端需求增加: 旧浏览器主要指的是IE6-IE8,它是不支持ES5特性的:IE9+.chrome.sarafi.firefox对ES5是完全支持的,移动端大 ...

  7. vue.js几行实现的简单的todo list

    序:目前前端框架如:vue.react.angular,构建工具fis3.gulp.webpack等等...... 可谓是五花八门,层出不穷,眼花缭乱...其实吧只要你想玩还是可以玩玩的..下面是看了 ...

  8. Vue.js——60分钟组件快速入门(上篇)

    组件简介 组件系统是Vue.js其中一个重要的概念,它提供了一种抽象,让我们可以使用独立可复用的小组件来构建大型应用,任意类型的应用界面都可以抽象为一个组件树: 那么什么是组件呢?组件可以扩展HTML ...

  9. Vue.js——60分钟快速入门

    Vue.js介绍 Vue.js是当下很火的一个JavaScript MVVM库,它是以数据驱动和组件化的思想构建的.相比于Angular.js,Vue.js提供了更加简洁.更易于理解的API,使得我们 ...

随机推荐

  1. scikit-learn学习笔记-bili莫烦

    bilibili莫烦scikit-learn视频学习笔记 1.使用KNN对iris数据分类 from sklearn import datasets from sklearn.model_select ...

  2. 一文秒懂CPU使用率

    目录 CPU:Cores, and Hyper-Threading  超线程(Hyper-Threading ) 多核(multi-cores) CPU使用率计算 CPU使用率测试 如何计算CPU使用 ...

  3. java 字节码指令集

    This is a list of the instructions that make up the Java bytecode, an abstract machine language that ...

  4. Mysql索引优化之索引的分类

    Mysql的历史 简单回顾一下Mysql的历史,Mysql 是一个关系型数据库管理系统,由瑞典 Mysql AB 公司开发,目前属于 Oracle 公司.关系型数据库​将数据保存在不同的表中,而不是将 ...

  5. 学习体验centos7 下根目录扩容操作(步骤详细!!!)

    转自  苗尼玛乔 感谢你!

  6. JRebel的优势与使用(基于IDEA)

    在平时的工作产出中,代码出现问题时往往要不停的修改测试其正确性,每次修改一部分代码都需要重启项目,这十分的耗时,对于企业大型项目来说你重启的时间够你去喝杯咖啡了,本篇博文主要就减少重启项目时间为目的来 ...

  7. HDU 5616:Jam's balance(背包DP)

    http://acm.hdu.edu.cn/showproblem.php?pid=5616 题意:有n个物品,每个重量为w[i],有一个天平,你可以把物品放在天平的左边或者右边,接下来m个询问,问是 ...

  8. umeditor 上传图片 相对路径的设置和保存

    此篇文章仅献给已实现百度富文本编辑器,想要设置相对路径并保存到数据库,方便以后项目迁移. 使用的版本为1.2.3,适用图片上传中点击以及拖拽功能. //保存图片相对地址的设置        //1.请 ...

  9. 【搜索引擎】 PostgreSQL 10 实时全文检索和分词、相似搜索、模糊匹配实现类似Google搜索自动提示

    需求分析 要通过PostgreSQL实现类似Google搜索自动提示的功能,例如要实现一个查询海量数据中的商品名字,每次输入就提示用户各种相关搜索选项,例如淘宝.京东等电商查询 思路 这个功能可以用 ...

  10. cur.execute(sql,args)和cur.execute(sql)的区别

    轉:https://blog.csdn.net/mjjyszazc/article/details/88932664 方式一: userid = “123”sql = “select id,name ...