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. 高并发 Nginx+Lua OpenResty系列(1)——环境搭建

    OpenResty是一款基于Nginx的高性能负载均衡服务器容器,简单来说是Nginx+Lua.结合了Lua语言来对Nginx进行扩展,使得在Nginx上具有web容器功能. OpenResty运行环 ...

  2. Netty源码分析--创建Channel(三)

    恩~,没错,其实这一篇才是真正的开始分析源码,你打我呀~. 先看一下我Netty的启动类 private void start() throws Exception { EventLoopGroup ...

  3. ubuntu16.04基本设置

    1. ubuntu16.04开启ssh https://jingyan.baidu.com/article/f54ae2fc6f9eef1e93b8497a.html 2. windows 远程桌面连 ...

  4. 你真的会用mysql行级锁吗?mysql 行级锁全解析

    在互联网大并发应用大行其道的今天,应用的开发总是离不开锁,在分布式应用中,最常见的莫过于基于数据库的行级锁了,由于互联网公司中比较主流的数据库还是mysql,所以这一话题绕不开的就是mysql了,但是 ...

  5. 并发编程-concurrent指南-Lock

    既然都可以通过synchronized来实现同步访问了,那么为什么还需要提供Lock?这个问题将在下面进行阐述.本文先从synchronized的缺陷讲起,然后再讲述java.util.concurr ...

  6. 2018.9.8 2018NOIP冲刺之配对

    普及组第四题难度 主体思路竟然是贪心Q_Q 链接:https://www.nowcoder.com/acm/contest/164/D来源:牛客网 题目描述 小A有n个长度都是L的字符串.这些字符串只 ...

  7. 【Mysql】索引简介

    本文口味:番茄炒蛋,预计阅读:10分钟. 博客又停更了两个月,在这期间,对人生和世界多了许多思考.在人生的不同阶段,会对生活和世界有着不一样的认知,而认知的改变也会直接反应在行为模式之中. 对于生活的 ...

  8. 安装Eclipse for MAC 苹果版

    1. 安装Eclipse for MAC 苹果版 2. Thank you for downloading Eclipse If the download doesn't start in a few ...

  9. .Net进程外session配置

    配置步骤: 1.开启 ASP.NET状态服务:cmd状态下:services.msc 2.配置web.config文件,在system.web下加入如下配置 <sessionState mode ...

  10. .Net Core 学习依赖注入自定义Service

    1. 定义一个服务,包含一个方法 public class TextService { public string Print(string m) { return m; } } 2. 写一个扩展方法 ...