Vue基础day3

如何收集表单数据

若：<input type="text"/>则v-model收集的是value值，用户输入的就是value值
若：<input type="radio"> 则v-model收集的是value值，且要给标签配置value值
若：<input type="checkbox"/>
    1.没有配置input的value属性，那么收集的就是checked(勾选or 未勾选，是布尔值)
    2.配置input的value的属性
        （1）v-model的初始值是非数组，那么收集的就是checked(勾选 or未勾选，是布尔值)
        （2）v-model的初始值是数组，那么收集的就是value组成的数组 

过滤器的实现

1. 定义：对要显示的数据进行特定格式化后再显示（）适合用于一些简单逻辑的处理
2. 语法：
   1. 注册过滤器：vue.filter(name,callback)或new Vue(filters:{})
   2. 使用过滤器：{{xxx|过滤器名}}或v-bind：属性=“xxx|过滤器名”
3. 备注：
   1. 过滤器也可以接受额外参数、多个过滤器也可以串联
   2. 并没有改变原本的数据，是产生新的对应的数据

//使用过滤器
 <h3>现在是：{{time | timeFormater}}</h3>
 //全局过滤器
  Vue.filter('mySlice', function (value) {
        return value.slice(0, 4)
    })
// 局部过滤器，跟data是一级的
filters: {
    timeFormater(value) {
        return dayjs(value).format('YYYY-MM-DD HH:mm:ss')
    },
},

原型

const p = new Demo()
console.log(Demo.prototype)//显示原型属性
console.log(p.__proto__)//隐式原型属性

组件的使用

1. 定义组件（创建组件）
2. 注册组件
3. 使用组件

关于VueComponent