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. Zookeeper详解-应用程序(七)

    Zookeeper为分布式环境提供灵活的协调基础架构.ZooKeeper框架支持许多当今最好的工业应用程序.我们将在本章中讨论ZooKeeper的一些最显着的应用. 雅虎 ZooKeeper框架最初是 ...

  2. .NET Core 3.0之深入源码理解Kestrel的集成与应用(一)

      写在前面 ASP.NET Core 的 Web 服务器默认采用Kestrel,这是一个基于libuv(一个跨平台的基于Node.js异步I/O库)的跨平台.轻量级的Web服务器. 在开始之前,先回 ...

  3. 移动IM开发指南3:如何优化登录模块

    <移动IM开发指南>系列文章将会介绍一个IM APP的方方面面,包括技术选型.登陆优化等.此外,本文作者会结合他在网易云信多年iOS IM SDK开发的经验,深度分析实际开发中的各种常见问 ...

  4. 【】input中 type=number 去掉箭头

    css中设置: input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: non ...

  5. 使用SpringSecurity搭建授权认证服务(1) -- 基本demo认证原理

    使用SpringSecurity搭建授权认证服务(1) -- 基本demo 登录认证是做后台开发的最基本的能力,初学就知道一个interceptor或者filter拦截所有请求,然后判断参数是否合理, ...

  6. decimal.ToString()问题

    decimal dt = 1.00M;            decimal dt1 = 1M;                         bool d = dt == dt1;         ...

  7. mysql双机热备实现方案

    一.概念 1.热备份和备份的区别 热备份指的是:High Available(HA)即高可用,而备份指的是Backup,数据备份的一种.这是两种不同的概念,应对的产品也是两种功能上完全不同的产品.热备 ...

  8. WebSocket API 学习笔记

    WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议. WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据.在 W ...

  9. HDU 1007:Quoit Design(分治求最近点对)

    http://acm.hdu.edu.cn/showproblem.php?pid=1007 题意:平面上有n个点,问最近的两个点之间的距离的一半是多少. 思路:用分治做.把整体分为左右两个部分,那么 ...

  10. Django中使用JS通过DataTable实现表格前端分页,每页显示页数,搜索等功能

    Django架构中自带了后端分页的技术,通过Paginator进行分页,前端点击按钮提交后台进行页面切换. 优缺点:后端分页对于数据量大的场景有其优势,但页面切换比较慢. 后端分页python3代码如 ...