el 类型 string | element
vue实例挂载的dom元素
data 类型 obj | function
vue 实例的数据对象
因为同一个组件创建的不同实例会共享引用同一个data,所以在组件中 data只能是函数。
methods 类型 { [key: string]: function }
函数中this绑定到Vue实例
computed 类型 { [key: string]: function | { get: function,set: fucntion } }
默认使用get方法,当设置set方法时,当computed监听的值发生变化时,set会被调用。
template 类型 string
模板占位符,可以包裹元素,并且不会渲染到dom上
render 类型 (createElement : () => VNode) => VNode(虚拟节点)
渲染函数
watch 类型 {[key: string]: string | function | object | array}
key是需要观察的表达式
props 类型 array<string> | object
用于接收父组件的数据
Vue.component('my-title', {
props: ['name'],
template: '<span>{{name}}<span>'
})
<my-title name = 'test'><my-title>
**created, mounted **
类型都是function,在不同阶段被调用
v-bind 缩写 ‘:’ 动态绑定元素属性
<a v-bind:href='url'>link</a>
v-on 缩写’@’ 绑定事件监听器
<div v-on:click='functionName'></div>
v-for 多次渲染相应元素
<div v-for='each in items'>{{each}}</div>
v-if v-else v-else-if 根据条件渲染元素
<div v-if='a > 10'>10+</div>
<div v-else-if='a > 5'>5-10</div>
<div v-else='a > 0'>0-5</div>
v-once 只渲染一次
v-html 更改元素的innerHTML
v-text 更新元素的textContent
<p v-text='msg'></p>
等同于<p>{{msg}}</p>
v-show 改变元素display值,元素会被渲染
v-model 在<input>
,<textare>
,<select>
上创建双向数据绑定
<input v-model='msg' > <p>{{msg}}</p>
v-slot 缩写’#’ 用于<template> 组件
参数是插槽名
<template v-slot='header></template>'
本文地址:https://blog.csdn.net/qq_42817444/article/details/107346156
如对本文有疑问, 点击进行留言回复!!
蒲公英 · JELLY技术周刊 Vol.14: Vue 3 新特性详解
keepalived+haproxy+mycat+mysql高可用搭建配制
vue中子组件的created、mounted生命周期钩子中获取不到props中的值问题
网友评论