vue知识点散记
1、iphone5微信浏览器里的methods里貌似不兼容 test(){} 写法,只支持test:function(){}
2、v-cloak 防止双括号的闪烁
<div id="app" v-cloak>{{test}} </div>
在style里
[]v-cloak]{display:none;//display:none!important;}
3、computed和watch都有缓存机制 ,{{}}==>差值表达式
4、计算属性的set和get方法
computed:{
fullName:{
get:function(){return this.a+this.b;},
set:function(value){var test=value.split('/');this.a=test[0];this.b=test[1]; }
}
}
vm.fullName='gello/world'
5、vue中的样式
(1)class
<div v-bind:class="{ active: isActive }"></div>
<div class="static" v-bind:class="{ active: isActive, 'text-danger': hasError }"> </div>
<div v-bind:class="classObject"></div>
computed: { classObject: function () { return { active: this.isActive && !this.error, 'text-danger': this.error && this.error.type === 'fatal', } } }
<div v-bind:class="[activeClass, errorClass]"></div>
<div v-bind:class="[errorClass ,isActive ? activeClass : '']"></div>
(2)style
<div v-bind:style="{ color: activeColor, fontSize: fontSize + 'px' }">菜鸟教程</div>
<div v-bind:style="styleObject">菜鸟教程</div>
data: {styleObject: {color: 'green',fontSize: '30px'}}
<div v-bind:style="[baseStyles, overridingStyles]">菜鸟教程</div>
data: {baseStyles: {color: 'green',fontSize: '30px'},overridingStyles: {'font-weight': 'bold'}}
注意:当 v-bind:style 使用需要特定前缀的 CSS 属性时,如 transform ,Vue.js 会自动侦测并添加相应的前缀。
6、数组的一些方法
vm.list[2]=3 ==>数据虽然变了,但是页面没有动态显示
//下面是有效的
(1)对象操作
Vue.set(vm.userInfo,"address","beijing")
vm.$set(vm.userInfo,"address","beijing")
(2)数组操作
1)变异方法 pop shift unshift。
2)Vue.set(vm.list,1,5) 数组下标为1的把值改成5
3)vm.$set(vm.userInfo,2,10)
4)数组的引用
7、:is的用法
通常情况下table->tr->td ,如果把tr用子组件代替的话,有的浏览器就可能不是这个顺序
vue知识点散记的更多相关文章
- 【vue知识点】1)vue生命周期
[vue知识点]2)vue登录认证
- vue知识点汇总
一.学习vue必须了解的几个知识点 1.node.js介绍 node是一个让JavaScript运行在服务端的开发平台,使用JavaScript也可以开发后台服务.说明白些它仅仅是一个平台,我们使用 ...
- vue知识点13
知识点归纳整理如下: 组件 component 1.页面中的一部分,可以复用, 本质上是一个拥有预定义选项的一个 Vue 实例 2.使用 1)定义 ...
- vue知识点12
知识点归纳整理如下: 1. 数组用下标改变,或者对象增加属性,这样的改变数据 是不能触发视图更新的,要用 Vue.set(对象,属性,值) 或this.$set(对象,属性,值) 2. this. ...
- Vue知识点
1. Vue生命周期图示: 2.插值: 文本:{{ message }}: 纯html:v-html="xxx"; 属性:v-bind:id="xxx"; 使用 ...
- Vue面试中,经常会被问到的面试题/Vue知识点整理
一.对于MVVM的理解? MVVM 是 Model-View-ViewModel 的缩写.Model代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑.View 代表UI 组件,它负责将数 ...
- Vue知识点(面试常见点)
v-bind和v-model的区别 1.v-bind用来绑定数据和属性以及表达式,缩写为':' 2.v-model使用在表单中,实现双向数据绑定的,在表单元素外使用不起作用 什么是 mvvm? MVV ...
- 【前端vue开发】vue知识点超链接学习笔记
1.如何去除vue项目中的 # --- History模式: https://www.cnblogs.com/zhuzhenwei918/p/6892066.html 2.三分钟教你写个Vue组件: ...
- Vue知识点超快速学习
基础知识: vue的生命周期: beforeCreate/created.beforeMount/mounted.beforeUpdate/updated.beforeDestory/destorye ...
随机推荐
- 第二单元总结:基于synchronize锁的简单多线程设计
单元统一的多线程设计策略 类的设计 电梯 每部电梯为一个线程. 电梯从调度器接收原子指令,知晓自己的状态(内部的人/服务的人.运行方向.所在楼层) 原子指令包括且仅包括: 向上走一层 / 向下走一层 ...
- P1072 开学寄语
P1072 开学寄语 转跳点:
- DNS 访问 Service【转】
在 Cluster 中,除了可以通过 Cluster IP 访问 Service,Kubernetes 还提供了更为方便的 DNS 访问. kubeadm 部署时会默认安装 kube-dns 组件. ...
- ROS学习笔记7-理解服务(services)和参数(parameter)
本文内容来自官方wiki:http://wiki.ros.org/ROS/Tutorials/UnderstandingServicesParams ROS服务(service)服务也是ROS中一种通 ...
- JVM:垃圾回收
概述 上一篇文章我们已经了解了 Java 的这几块内存区域.对于垃圾回收来说,针对或者关注的是 Java 堆这块区域.因为对于程序计数器.栈.本地方法栈来说,他们随线程而生,随线程而灭,所以这个区域的 ...
- java集合简单特性
- http 请求code状态码
状态码 含义 100 客户端应当继续发送请求.这个临时响应是用来通知客户端它的部分请求已经被服务器接收,且仍未被拒绝.客户端应当继续发送请求的剩余部分,或者如果请求已经完成,忽略这个响应.服务器必须在 ...
- 将visual sdudio+Qt5.12 制作的程序打包成单个exe
在GitHub上下载了个qt程序,由于C++不太会,经过安装qt.修改编码等一系列操作终于可以运行了. 生成的exe在运行时依赖很多dll或者图片文件,直接拷贝到其他电脑上无法运行,可以将依赖的dll ...
- 2.13 ViewModel 使数据即使在后台被杀死数据也能存活
操作程序如下: 主要是创建一个 SavedStateHandle 来缓存上一次的数据,并通过重新读取上一次存储的数据来实现数据的存活 MyVIewModel: package com.example. ...
- 09.swoole学习笔记--创建进程
<?php //进程数组 $workers=[]; //创建进程的数据量 $worker_num=; //创建启动进程 ;$i<$worker_num;$i++){ //创建单独新进程 $ ...