vue.js主要内容
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主要内容的更多相关文章
- Vue.js安装使用教程
一.说明 上大学前,请的都是前端JavaScript.后端ASP/PHP/JSP.前后端代码混杂:上大学时,请的都是前端Jquery.后端SSH.前后端代码分离通过模板关联:大学出来后,请的都是前端三 ...
- 一个基于Vue.js+Mongodb+Node.js的博客内容管理系统
这个项目最初其实是fork别人的项目.当初想接触下mongodb数据库,找个例子学习下,后来改着改着就面目全非了.后台和数据库重构,前端增加了登录注册功能,仅保留了博客设置页面,但是也优化了. 一.功 ...
- 学习Vue.js需要了解的部分内容
重要: 1.如果要通过js/模板引用 图片到项目,图片路径需要使用require. 2.$event: $event 等于$emit 抛出的值,还可以使用$event.target.value. $e ...
- Vue.js 和 MVVM 小细节
MVVM 是Model-View-ViewModel 的缩写,它是一种基于前端开发的架构模式,其核心是提供对View 和 ViewModel 的双向数据绑定,这使得ViewModel 的状态改变可以自 ...
- Vue.js 2.0 和 React、Augular等其他框架的全方位对比
引言 这个页面无疑是最难编写的,但也是非常重要的.或许你遇到了一些问题并且先前用其他的框架解决了.来这里的目的是看看Vue是否有更好的解决方案.那么你就来对了. 客观来说,作为核心团队成员,显然我们会 ...
- 从Vue.js窥探前端行业
近年来前端开发趋势 1.旧浏览器逐渐淘汰,移动端需求增加: 旧浏览器主要指的是IE6-IE8,它是不支持ES5特性的:IE9+.chrome.sarafi.firefox对ES5是完全支持的,移动端大 ...
- vue.js几行实现的简单的todo list
序:目前前端框架如:vue.react.angular,构建工具fis3.gulp.webpack等等...... 可谓是五花八门,层出不穷,眼花缭乱...其实吧只要你想玩还是可以玩玩的..下面是看了 ...
- Vue.js——60分钟组件快速入门(上篇)
组件简介 组件系统是Vue.js其中一个重要的概念,它提供了一种抽象,让我们可以使用独立可复用的小组件来构建大型应用,任意类型的应用界面都可以抽象为一个组件树: 那么什么是组件呢?组件可以扩展HTML ...
- Vue.js——60分钟快速入门
Vue.js介绍 Vue.js是当下很火的一个JavaScript MVVM库,它是以数据驱动和组件化的思想构建的.相比于Angular.js,Vue.js提供了更加简洁.更易于理解的API,使得我们 ...
随机推荐
- Rails.cache相关知识
可能里面的一些知识已经不被大家使用了,但是作为学习,我想和大家分享一下个人关于Rails.cache的浅显的认识,望大家指教. 1.Rails.cache是什么 它是Rails中的缓存,拥有所有缓存的 ...
- Node.js实现PC端类微信聊天软件(二)
Github StackChat 用到的React-Router React-Router是React路由的解决方案之一,也可以使用别的库 安装 npm install react-router -- ...
- ASP.NET Core MVC 之路由(Routing)
ASP.NET Core MVC 路由是建立在ASP.NET Core 路由的,一项强大的URL映射组件,它可以构建具有理解和搜索网址的应用程序.这使得我们可以自定义应用程序的URL命名形式,使得它 ...
- Oracle分组函数之ROLLUP用法
rollup函数 本博客简单介绍一下oracle分组函数之rollup的用法,rollup函数常用于分组统计,也是属于oracle分析函数的一种 环境准备 create table dept as s ...
- Idea中maven项目中导入本地jar包
说一下正确的流程: 1.将jar包导入到本地maven库或者远程nexus仓库,再使用maven引用: 2.导入命令: //通过一下信息引入maven -DgroupId=com.test -Dart ...
- Java虚拟机详解(二)------运行时内存结构
首先通过一张图了解 Java程序的执行流程: 我们编写好的Java源代码程序,通过Java编译器javac编译成Java虚拟机识别的class文件(字节码文件),然后由 JVM 中的类加载器加载编译生 ...
- mysql中TINYINT的取值范围
在MySQL的数据类型中,Tinyint的取值范围是:带符号的范围是-128到127.无符号的范围是0到255(见官方<MySQL 5.1参考手册>http://dev.mysql.com ...
- ZooKeeper入门(二) Zookeeper选举
1 背景 1.1 什么是leader选举 在zookeeper集群中,每个节点都会投票,如果某个节点获得超过半数以上的节点的投票,则该节点就是leader节点了 1.2 zookeeper集群选举le ...
- scrapy基础知识之随机切换fake-useragent 库的使用:
pip install fake-useragent from fake_useragent import UserAgent ua = UserAgent() middlewares.py from ...
- scrapy基础知识之 Scrapy-Redis分布式策略:
Scrapy-Redis分布式策略: 假设有四台电脑:Windows 10.Mac OS X.Ubuntu 16.04.CentOS 7.2,任意一台电脑都可以作为 Master端 或 Slaver端 ...