Vue学习记录

三目运算符

布尔表达式?表达式1:表达式2
运算过程：如果布尔表达式的值为 true ，则返回 表达式1 的值，否则返回 表达式2 的值
例： OK ? ‘Yes’ : ‘No’
当OK 是True时返回Yes
此处“布尔表达式”可以为变量，可以为表达式 如a>b

_.debounce

/*
.debounce 是一个通过 Lodash 限制操作频率的函数，在这个例子中，我们希望限制访问 yesno.wtf/api 的频率
AJAX 请求直到用户输入完毕才会发出；想要了解更多关于.debounce 函数 (及其近亲 _.throttle) 的知识，请参考：https://lodash.com/docs#debounce
*/

indexOf()

indexOf() 方法可返回，某个指定的字符串值在字符串中首次出现的位置。
var str = “Hello world!”;
console.log(str.indexOf(“Hello”)) // 0
console.log(str.indexOf(“World”)) // -1
console.log(str.indexOf(“world”)) // 6

capitalize

Python – capitalize()函数
描述：将字符串的第一个字母变成大写，其余字母变为小写。

事件修饰符

.stop 阻止冒泡
.prevent 阻止默认事件
.capture 添加事件侦听器时使用事件捕获模式 先触发带有该修饰符的元素
.once 事件只触发一次 如一个按钮点击多次，只处理一次
.self 只有点击当前元素本身时才会触发回调

详见https://blog.csdn.net/jingjing217/article/details/108235961

Dom

DOM (Document Object Model) 译为文档对象模型，是 HTML 和 XML 文档的编程接口。
HTML DOM 定义了访问和操作 HTML 文档的标准方法。
DOM 以树结构表达 HTML 文档。

instanceof

instanceof 是 Java 的一个二元操作符，类似于 ==，>，< 等操作符。
instanceof 是 Java 的保留关键字。它的作用是测试它左边的对象是否是它右边的类的实例，返回 boolean 的数据类型。

if (o instanceof Vector)
	System.out.println("对象是 java.util.Vector 类的实例");
else if (o instanceof ArrayList)
	System.out.println("对象是 java.util.ArrayList 类的实例");
else
	System.out.println("对象是 " + o.getClass() + " 类的实例");

输出：对象是 java.util.ArrayList 类的实例

$emit

1、父组件可以使用 props 把数据传给子组件。
2、子组件可以使用 $emit,让父组件监听到自定义事件 。

vm.$emit( event, arg ) //触发当前实例上的事件

vm.$on( event, fn );//监听event事件后运行 fn；

对比

1、v-on:事件绑定，缩写@，经过v-on绑定的属性可以直接执行js代码,也可以去vue中methods中寻找函数执行。
传入event
如果在事件处理函数中,想要获取原生的DOM事件,那么在html代码中,调用的时候,可以传递一个$event参数。

<!-- '@是v-on的简写' methods中寻找add函数执行 -->
<button @click='add(10,$event)'>每次点击+10</button>


methods: {
	add(num){
	     this.count += num
	     console.log(event)
	 }
}

2、v-bind: 属性绑定，缩写 ：v-bind:class=“属性data”
3、v-model:因为双向绑定的特性,导致其常用于表单输入绑定。即绑定元素中更改了值会自动更新属性中的值,属性中的值更新了也会同步到绑定元素中。
修饰符：
①.lazy:一种非同步修改,默认情况下,我们将文本框双向绑定后,我们的任何改变都会被立即同步进入数据,但这种同步在大多数时候是没有必要的,我们可以等待用户全部输入结束后在进行同步,可以节省资源。
②.number:可以看成强制类型转换,将用户输入的内容强制转换成为数字。
③.trim:去除空格(去除文本开头和结尾的所有空格,文本中间如果出现空格则不会去除)