Vue3组件化开发

一、V-model

1. V-model的原理

2. v-model修饰符 - lazy

 

lazy修饰符是什么作用呢？

默认情况下，v-model在进行双向绑定时，绑定的是input事件，那么会在每次内容输入后就将最新的值和绑定的属性进行同步；

如果我们在v-model后跟上lazy修饰符，那么会将绑定的事件切换为 change 事件，只有在提交时（比如回车才会触发；

3. v-model修饰符 - number

 

4. v-model修饰符 - trim

 

如果要自动过滤用户输入的首尾空白字符，可以给v-model添加 trim 修饰符 ：

 

 

二、组件

1. 注册组件的方式

注册组件分成两种：

 

全局组件：在任何其他的组件中都可以使用的组件；

局部组件：只有在注册的组件中才能使用的组件；

 

2. 组件的名称

                                              

在通过app.component注册一个组件的时候，第一个参数是组件的名称，定义组件名的方式有两种：