VUE.js入门学习(2)-基础精讲
1、VUE 实例 - 一个项目是有很多的vue实例拼装的。每一个组建就是vue的实例。
var vm = new Vue()
2、VUE 实例生命周期钩子
生命周期函数:VUE实例在某一个时间点会自动执行的函数

3、VUE 的模版语法
{{content}}、v-text="文字"、v-html="代码"
4、计算属性,方法与侦听器 (重要)
(1)计算属性 computed 有一个缓存,变量不变他不变

(2)侦听器 watch 也有缓存机制

二者可以同时使用时。我们推荐用computed
5、计算属性的 getter 和 setter

6、Vue中的样式绑定
(1):class="js表达式"

(2):class="[one,two]"

(3) :style="object"

(4):style="[object,{font-size:12px}]"

7、Vue中的条件渲染
(1)v-if="" 就不存在了
(2)v-show="" 相当于 display:none的效果
8、Vue中的列表渲染
(1)v-for=" (item,key,index) of list" :key="item.id"
(2)模版占位符,在前台不显示,比div好

9、Vue中的set方法
(1)全局方法

(2)实例方法

(3)用set方法改变数组
Vue.set(数组名,第几位,改的数值)
vm.$set(数组名,第几位,改的数值)
VUE.js入门学习(2)-基础精讲的更多相关文章
- Vue.JS入门学习随笔
PS:先说说学习Vue的缘由吧,学习完了React之后,突然发现又出了一款叫做vue的框架,而且据说可以引领又一波新框架的潮流,我容易吗我!!! Vue.js(读音 /vjuː/, 类似于view ...
- vue.js 入门学习
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- VUE.js入门学习(4)-动画特效
1.VUE中CSS动画原理(more是 v-enter 具体的根据 name的来决定) 动画是通过在某一时间段来添加样式决定的. 要通过 transition进行包裹. 2.在VUE中使用 anim ...
- VUE.js入门学习(3)-深入理解VUE组建
1.使用组件的细节点 (1)is="模版名" (2)在子组建定义data的时候,data必须是一个函数,而不能是一个对象,每个子组建都有自己的数据存储.之间不会相互影响. (3)操 ...
- VUE.js入门学习(1)-起步
1.hello world <div id="app">{{content}}</div>var app = new Vue({ el:'#app', da ...
- vue.js入门学习
可以用淘宝npm镜像 然后安装 然后初始化项目: Watch就是一个监听 v-if是如果为false就根本不在页面存在这个元素 v-show是通过display:none来控制这个元素的显示和隐藏 r ...
- VUE.js入门学习(5)- 插槽和作用域插槽
插槽: (1)用法 以前的写法:如果内容很多的话,就很烂了- 插槽写法:(PS:组建名不能用保留关键字) (2)具名插槽 (3)作用域插槽 必须template开始和结尾,这个插槽要声明我从子组建接收 ...
- Vue 基础精讲
Vue 基础精讲 Vue 官方文档:https://cn.vuejs.org/v2/guide/ VUE 实例 每个组件都是一个 vue 的实例. 一个 vue 项目是由实例组成的. vue 实例上有 ...
- Vue.js 入门:从零开始做一个极简 To-Do 应用
Vue.js 入门:从零开始做一个极简 To-Do 应用 写作时间:2019-12-10版本信息:Vue.js 2.6.10官网文档:https://cn.vuejs.org/ 前言 学习 Vue ...
随机推荐
- Docker 简单使用笔记
Docker笔记 安装 首先检查是否已经安装过Docker:yum list installed | grep docker,如果已经安装过需要删除旧的Docker:yum remove dock ...
- zabbix proxy配置实战案例
zabbix proxy配置实战案例 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.zabbix proxy概述 上一篇博客我们分享了zabbix agent有两种工作模式,即 ...
- 实验吧——Recursive
环境:win10,kali虚拟机 工具:ida 虚拟机打开看看,发现是ELF文件,运行一下,额没有什么发现. Ida打开看看,发现是在文件内部运行python解释器,百度搜索了一个基本上可以找到Py_ ...
- Arch-base-vs-iso
Arch-base-vs-iso 通常绝大多数的Linux分发版的iso镜像本身(*.iso文件都有约2Gb上下)都可以直接启动电脑并运行完整的Linux桌面系统. 极少数的Linux发行版仅提供命令 ...
- 基于vue-router的移动端网页的路由管理
本篇代码示例:github 前提:不关注移动端浏览器的前进事件 涵盖功能: 1,管理路由的历史记录 2,切页动画的实现 3,处理流程类页面的回退事件 描述: 流程类页面的回退事件的解释: 以注册 ...
- dwr??
官方网站:http://directwebremoting.org/dwr/index.html http://m.blog.csdn.net/u013628152/article/details/5 ...
- 删除C代码中的注释行【状态机】
今天在学ruby时遇到的一个经典的题目,一直都知道但从来没有实现过.呈上状态机,代码略.(写代码的时候还是需要注意一些小情况的)
- maven详解 之 pom.xml
Maven 一个项目管理工具 其作用就是用来管理jar 包的 maven的核心 pom.xml配置文件 <project xmlns="http://maven.apache ...
- 微信小程序学习开发笔记
首先注册小程序开账号,下载开发工具之后,先啃官方文档:https://developers.weixin.qq.com/miniprogram/dev/framework/ ,把小程序的基本的代码框架 ...
- redis学习(六)
一.Redis 数据备份与恢复 1.Redis SAVE 命令用于创建当前数据库的备份.该命令将在 redis 安装目录中创建dump.rdb文件. 2.语法:redis 127.0.0.1:6379 ...