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界面的渐进式框架. 目 ...
随机推荐
- Django:在OS X环境下连接MySQL数据库
正常的安装只需要执行以下2条命令: $ brew install mysql-connector-c $ pip3 install mysqlclient 但在执行 pip3 install mysq ...
- Spring 2017 Assignments2
一.作业要求 原版:http://cs231n.github.io/assignments2017/assignment2/ 翻译:http://www.mooc.ai/course/268/lear ...
- 解放双手——相机与IMU外参的在线标定
本文作者 沈玥伶,公众号:计算机视觉life,编辑部成员 一.相机与IMU的融合 在SLAM的众多传感器解决方案中,相机与IMU的融合被认为具有很大的潜力实现低成本且高精度的定位与建图.这是因为这两个 ...
- gin+vue的前后端分离开源项目
该项目是gin+vue的前后端分离项目,使用gorm访问MySQL,其中vue前端是使用vue-element-admin框架简单实现的: go后台使用jwt,对API接口进行权限控制.此外,Web页 ...
- Zabbix遇到的问题集锦
一.Web界面上显示Zabbix server is not running 二.Zabbix显示中文字体 三.利用Python发送告警注意细节 四.zabbix上发告警信息不发恢复信息 五.Agen ...
- TDH 安装 TDH-Client
1. TDH-Client 下载 (下载分享:链接:https://pan.baidu.com/s/1ZmP4BUCiuRypCtsoAuvKRA 提取码:xsbl ) tar -vxf td ...
- var let及const
es6已经发布很久了,之前只会用var定义变量,学习了let和const后,又学到了一些作用域.JavaScript编译和深拷贝浅拷贝的知识.这章主要来说说这三个定义量的方法: 1.var 在没学习e ...
- nginx单机1w并发优化
目录 ab工具 整体优化思路 具体的优化思路 编写脚本完成并发优化配置 性能统计工具 tips 总结 ab工具 ab -c 10000 -n 200000 http://localhost/index ...
- 在github上搭建个人博客并在线更新
换博客比更博还勤的我终于决定写一篇博客搭建教程了.. FAQ Q:\(hexo\)需要本地编译.\(jekyll\)虽然可以直接上传\(md\)..但是如果在github上直接编译也太难受了叭,毕竟不 ...
- POST提交数据方式
application/x-www-form-urlencoded 这应该是最常见的 POST 提交数据的方式了.浏览器的原生 form 表单,如果不设置 enctype 属性,那么最终就会以 app ...