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界面的渐进式框架. 目 ...
随机推荐
- Spring aop 影响本地事务的回滚总结
1 @Before 不会,因为还没执行到service的业务逻辑 2 @ After 默认情况下,报错会影响事务回滚., 当设置@Order属性并设置值优先级大小, 即使报错也不会回滚了 ...
- 论文阅读 | Falcon: Balancing Interactive Latency and Resolution Sensitivity for Scalable Linked Visualizations
作者: Dominik Moritz, Bill Howe, Jeffrey Heer 发表于CHI 2019, 三位作者都来自于University of Washington Interactiv ...
- hadoop安装解决之道
# 壹.故障现象 ```xml Microsoft Windows [版本 10.0.18362.239] (c) 2019 Microsoft Corporation.保留所有权利. C:\User ...
- Amazon S3
Amazon S3 是什么? Amazon S3 是亚马逊推出的一款存储服务,名为 Amazon Simple Storage Service,即亚马逊简单存储服务. 有些 S3 的概念需要了解一下: ...
- 主成分分析 Principle Component Analysis
一.主要思想 利用正交变换把可能线性相关变量表示的观测数据,转换为由少数几个线性无关变量(主成分)表示的数据.(重构原始特征空间:线性降维) 要尽可能保留原始数据中的信息,两个思路:最大投影方差.最小 ...
- 使用mybatis实现分页查询示例代码分析
*******************************************分页查询开始*************************************************** ...
- DT-06 For MQTT
感谢关注深圳四博智联科技有限公司产品!我公司提供完整的WiFi信号强度采集方案,包括WiFi信号采集.设备远程管理平台.智能终端应用等. Doit_MQTT透传固件基于乐鑫ESP_IOT_SDK使用C ...
- windows查看端口被占用
1.打开控制台终端 2.在命令行下输入netstat -ano|findstr "8080"(8080是被占用的端口) 3.记住最后一列的数字PID如4684 4.输入taskli ...
- Oracle中的通用函数
1.nvl(列,默认值)函数处理null select nvl(null,3),nvl(4,3) from dual 结果显示为3,4.因为nvl中的第一个为null时,返回结果为第二个值,第一 ...
- net core Webapi基础工程搭建(三)——在线接口文档Swagger
目录 前言 Swagger NuGet引用第三方类库 别急,还有 没错,注释 小结 前言 前后分离的好处,就是后端埋头做业务逻辑功能,不需要过多考虑用户体验,只专注于数据.性能开发,对于前端需要的数据 ...