vue基础技术点列表(一)
一. vue编写需要注意的细节
1.vue初始化实例时使用首字母大写,在添加全局配置时也要首字母大写(如添加组件Vue.component("",{template:"",prop:[]}))
2.Vue的配置项中名称内不能含有中短横- 星号* @ 标点,否则会报错.可以使用下划线;
3.设置Vue的全局配置如,组件,筛选函数,注意位置,设置前的Vue实例是不包含设置内容的
4.新版Vue的{{$index}}取消了,在for循环中要使用{{index}}取索引值 ,如 <li v-for="(item,index) in items">{{item}}{{index}}</li>
第一个是值,第二个参数是索引;
5.更改data中的值直接写app.msg即可(不用中间写data)
6.不要在选项属性或回调上使用箭头函数
因为箭头函数是和父级上下文绑定在一起的,this 不会是如你所预期的 Vue 实例
7.由于html的特性是不区分大小写的,因此HTML中的标签哟啊传递值要写成短横线的形式;
8.对于所有的数据绑定,Vue提供了js表达式支持,每个绑定智能包含单个表达式,语句和控制流不会生效 否则会报compiling编译错误
二. Vue接口列举
1.插值 {{}}
2.v-if
3.v-show
4.v-for
5.v-model
6.new Vue({
el"",
data:{},
methods:{},
computed:{},
create:function(){this上下文指向调用他的Vue实例}
})
7.逆转字符串 this.message.split('').reverse().join('')
8.Vue全局注册组件 Vue.component("name",{template:"",props:[]/{}})
9.v-bind 将待办项传入循环输出的每个组件中
10.在一个大型的应用中,有必要将整个应用程序划分为组件
11.Vue应用是由一个通过new Vue创建的根Vue实例,以及可选的嵌套的,可复用的组件树组成.所有的Vue组件都是vue
实例并且接受相同的选项对象(一些根实例特有的选项除外)
12.Vue 实例被创建时他向响应式系统中加入了其data对讲中能找到的所有的属性,当这些属性值发生改变时,视图将会产生"响应",即匹配更新为新的值
13.ovject.freeze(data-obj)
14.$el
15.$data
16.$watch("data",function(new,old){})
17.var stop = app.$watch("a",cd);
stop();
18.生命周期钩子
created 钩子可以用来在一个实例被创建之后执行代码
19 $mount()初始化实例时未写入el,采用手动挂在到dom上
20 Vue使用了基于HTML的模板语法,允许开发中声明式的将DOM绑定至底层Vue实例的数据
在底层实现上,Vue将模板编译成虚拟DOM渲染函数,结合响应系统Vue能够智能地计算出最少需要重新渲染多少组件,并把DOM操作次数减到最少;
21 文本插值 双大括号,
v-once指令,执行一次性地插值,当数据改变是,插值处的内容不会更新;
22 v-html
23.v-bind MUstache语法不能作用在html特性上,遇到这种情况应该使用v-bind命令
24.指令的作用是档表但是的值改变是,将其产生的两代影响响应式的作用于DOM.
25.有的指令可以接受一个参数,指令名称之后以冒号表示例如v-bind:href v-on:click
26修饰符
MOdifiers是以半角句号.致命的天数后缀,用于之处一个指令应该以特殊方式绑定.例如
.prevent修饰符告诉 v-on指令对于触发的时间调用 event.perventDefault();方法
27缩写语法
v-bind :
v-on @
冒号和@杜宇特性名称来说是合法字符
28.模板内的表达式适用于简单运算的在模板中放入天多的逻辑会让mubna过重切难以维护,对于复杂逻辑你都应该使用计算属性
29. computed revers
计算属性是基于他们的依赖进行缓存的,计算属性只有在他的相关依赖发生改变是才会重新求职,这意味msg还没有改变,多次房屋计算属性 reverse 会立即返回之前计算结果而不必再次执行函数
Date.new() 不是响应式依赖不会更新
调用方法总会再次执行函数;
三. 存疑
1.Vue组件的 款组件数据流 自定义事件通信 构建工具集成
2.v-once xxx
3. JSX 语法
4.Mustache语法
vue基础技术点列表(一)的更多相关文章
- Vue基础进阶 之 列表过渡
在前面的博客我们一直在操作单个元素的过渡,如果是对多个元素过渡,例如列表,这时就要用到<transition-group>这个组件了: 如何使用:将要操作的列表元素放在<transi ...
- Vue基础-作用域插槽-列表组件
Vue 测试版本:Vue.js v2.5.13 Vue 官网介绍作用域插槽时, 在 2.5.0+,slot-scope 能被用在任意元素或组件中而不再局限于 <template>. 作用域 ...
- 3.Python编程语言基础技术框架
3.Python编程语言基础技术框架 3.1查看数据项数据类型 type(name) 3.2查看数据项数据id id(name) 3.3对象引用 备注Python将所有数据存为内存对象 Python中 ...
- 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十八║Vue基础: 指令(下)+计算属性+watch
回顾 今天来晚辣,给公司做了一个小项目,一个瀑布流+动态视频控制的DEMO,有需要的可以联系我,公司的项目就不对外展示了(一个后端程序员真的要干前端了哈哈哈). 书接上文,昨天正式的开始了Vue的代码 ...
- 从壹开始前后端分离 [ Vue2.0+.NET Core2.1] 十九║Vue基础: 样式动态绑定+生命周期
回顾 哈喽大家好,前后端分离系列文章又开始了,今天周一,还是感谢大家花时间来观看我写的博客,周末呢,没有写文章,但是也没有闲着,主要是研究了下遗留问题,看过之前文章的应该知道,之前的在AOP使用Red ...
- Java笔记(十二) 文件基础技术
文件基础技术 一.文件概述 一)基本概念 1.文件的分类: 1)文本文件:文件中每个二进制字节都是某个可打印字符的一部分.如.java文件 2)二进制文件:文件中每个二进制字节不一定用来表示字符,也可 ...
- python 全栈开发,Day89(sorted面试题,Pycharm配置支持vue语法,Vue基础语法,小清单练习)
一.sorted面试题 面试题: [11, 33, 4, 2, 11, 4, 9, 2] 去重并保持原来的顺序 答案1: list1 = [11, 33, 4, 2, 11, 4, 9, 2] ret ...
- Vue 基础精讲
Vue 基础精讲 Vue 官方文档:https://cn.vuejs.org/v2/guide/ VUE 实例 每个组件都是一个 vue 的实例. 一个 vue 项目是由实例组成的. vue 实例上有 ...
- Vue基础以及指令
Vue 基础篇一 一.Vue框架介绍 之前大家学过HTML,CSS,JS,JQuery,Bootstrap,现在我们要学一个新的框架Vue~ Vue是一个构建数据驱动的web界面的渐进式框架. 目 ...
随机推荐
- 邻域保持嵌入(NPE)
传统的线性降维方法,如主成分分析(PCA).因子分析(FA)等,关注的是样本的方差,能学习线性流形的结构,却无法学习非线性流形.而经典的流形学习方法虽然能够学习非线性流形结构,但由于本身属于直推学习, ...
- Java程序员备战“金九银十”必备的面试技巧(附携程Java岗面试题)
一.面试前的准备 1.1 如何准备一场面试1.1.1 如何获取大厂面试机会1.1.2 面试必知 ①. 准备介绍自己 ②. 关于着装 ③ .随身带上自己的成绩单和简历 ④. 如果笔试就提前刷一些笔试题 ...
- Ubuntu 16.04 安装 SVN-Client (RaabitVCS)
1.添加源 sudo add-apt-repository ppa:rabbitvcs/ppa 2. 更新源 sudo apt-get update 3.安装依赖库 sudo apt-get inst ...
- 如何以python风格高逼格的改成购物车逻辑
之前有一篇博文写到关于购物车的业务逻辑,分别运用cookie和redis存储未登录和登录用户的购物车数据,虽然已经很好的完成了业务逻辑,但是会发现代码的冗余很严重,也不够具有python特色,今天就让 ...
- LD_PRELOAD和ld --wrap
前言 LD_PRELOAD和ld --wrap都能实现不修改原始代码,替换指定函数的实现.通常我们会使用这些方法,替换如malloc)()/free().read()/write()等函数,并在替换函 ...
- MYSQL--存储引擎、数据类型、约束条件、
存储引擎: 不同的数据应该有不同的处理机制 mysql存储引擎 Innodb:默认的存储引擎 查询速度相比于myisam慢 但是更安全 myisam:mysql老版本用的存储引擎 memory:内 ...
- spark读取pg数据库报错操作符不存在
代码: Properties connectionProperties = new Properties(); connectionProperties.put("user", C ...
- JMM内存模型详解(一)
本文开始死磕JMM(Java内存模型)由于知识点较多,分来写 该文为JMM第一篇 技术往往是枯燥的,本文文字较多 1. JMM是什么? 其实JMM很好理解,我简单的解释一下,在Java多线程中我们经常 ...
- c++的构造和析构
//文件名ss.h 1 #pragma once class ss { private: char*p;//利用指针来为p申请对内存 float height; ; char sex; public: ...
- SpringBoot中使用rabbitmq,activemq消息队列和rest服务的调用
1. activemq 首先引入依赖 pom.xml文件 <dependency> <groupId>org.springframework.boot</groupId& ...