1. 使用.native 修饰符
<event @click='up' > </event>
如果此组件直接加 @click 是无法使用 @click 事件的
解决办法 使用.native修饰符 <event @click.native='up' > </event> 可以点击了 把自定义事件变为dom事件 获取的是最外面的跟标签
2. @chage和 @input的区别
change是在外面点击一下 num值才会变化, 而input是在输入框里直接实时变化
$event.target.value 直接获取当前那输入的值
3. v-model 实现父子组件的input框传递
父组件:
子组件:
这样 子组件变 父组件也跟着变
4.sync
也是父子组件的传递
5. $attrs 和 $listeners
$attrs 可以获取父组件传过来的属性
对于子组件来说 $attrs获取所有的值 包括title,type size 等等
$listeners 可以让父组件实现单击事件
父组件
子组件
6. ref 和 $children 和 $parent
ref可以获取子组件的实例 然后进行响应式的数据变化 他可以获取dom节点 也可以获取子组件的数据和方法
找小红和小明借钱 爸爸加钱 小红,小明减钱
$children可以获取子组件的数据和实例
借所有孩子的200块钱 爸爸加400
最后在子组件里 点击按钮 儿子减钱 给爸爸加钱 这就用到 $parent了
让父组件的钱增加
8.mixin混入
就是相同的js 放到一起 不重复写了
9.作用域插槽
作用域插槽:子组件数据来源于父组件,但是子组件决定不了它的外观与结构