vue 一些深入的技术


1. 使用.native 修饰符

如果此组件直接加 @click 是无法使用 @click 事件的

解决办法  使用.native修饰符     可以点击了 把自定义事件变为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.作用域插槽

作用域插槽:子组件数据来源于父组件,但是子组件决定不了它的外观与结构

vue