vue-进阶语法(四)

目录

v-model原理

v-model应用于组件

sync修饰符

ref 和 $refs(重点)

$nextTick


v-model原理

原理:v-model本质上是一个语法糖。例如应用在输入框上,就是 value属性 和 input事件 的合写。

作用:提供数据的双向绑定

① 数据变,视图跟着变 :value

② 视图变,数据跟着变 @input

注意:$event 用于在模板中,获取事件的形参

v-model应用于组件

sync修饰符

作用:可以实现 子组件 与 父组件数据 的 双向绑定,简化代码

特点:prop属性名,可以自定义,非固定为 value

场景:封装弹框类的基础组件, visible属性 true显示 false隐藏

本质:就是 :属性名 和 @update:属性名 合写

ref 和 $refs(重点)

$nextTick

需求:编辑标题, 编辑框自动聚焦

1. 点击编辑,显示编辑框

2. 让编辑框,立刻获取焦

问题:"显示之后",立刻获取焦点是不能成功的!

原因:Vue 是 异步更新 DOM (提升性能)

优化:

相关推荐

  1. 第III章-ⅠVue3语法

    2024-02-14 11:56:01       10 阅读
  2. vue3

    2024-02-14 11:56:01       18 阅读
  3. vue

    2024-02-14 11:56:01       7 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-02-14 11:56:01       16 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-02-14 11:56:01       16 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-02-14 11:56:01       15 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-02-14 11:56:01       18 阅读

热门阅读

  1. vue3 + Babylon.js 实现3D场景

    2024-02-14 11:56:01       40 阅读
  2. 14.6 OpenGL图元装配和光栅化:多边形

    2024-02-14 11:56:01       25 阅读
  3. 14.5 OpenGL图元装配和光栅化:线段

    2024-02-14 11:56:01       29 阅读
  4. c语言练习

    2024-02-14 11:56:01       29 阅读
  5. MD5 哈希

    2024-02-14 11:56:01       26 阅读
  6. Git入门

    Git入门

    2024-02-14 11:56:01      30 阅读
  7. free pascal:fpwebview 组件简单易用

    2024-02-14 11:56:01       35 阅读
  8. QT自定义信号和槽

    2024-02-14 11:56:01       30 阅读
  9. 蓝桥杯每日一题----素数筛

    2024-02-14 11:56:01       31 阅读