vue 抽离成组件后watch不能正常监听

Question

vue组件中watch监听formSearch的修改，但是在监听中修改formSearch.memberPhone就监听不到了，之前写在页面中没有问题，但是现在抽离成组件就这样了

<template lang="pug">
div.vip-search-bar.flex.border-bottom
            Form.search-from(
                inline :label-width="60"
                :model="formSearch"
                ref="formSearch")
                div
                    FormItem(label="会员卡号" )
                        Input.s-input(v-model="formSearch.memberSn"  placeholder="请输入...")
                    FormItem(label="姓名")
                        Input.s-input(v-model="formSearch.memberName" placeholder="请输入...")
                    FormItem(label="手机号" prop="memberPhone")
                        Input.s-input(
                            v-model="formSearch.memberPhone" placeholder="请输入...")
                div
                    FormItem(label="注册时间")
                        DatePicker.datePicker.l-input(
                            placeholder="请输入..."
                            :options="datePickerOption"
                            type="daterange"
                            v-model="formSearch.time")
            Button.btn-search(@click="search") 查询
</template>
<script>
export default {
    name: 'VipSearch',
    data () {
        let _that = this
        return {
            formSearch: {}, // 搜索表单
            // 设置快捷选项,每项内容
            datePickerOption: {
                shortcuts: [
                    {
                        text: '最近一周',
                        value () { return     _that.getDatePickerData(7)    }
                    },
                    {
                        text: '最近一个月',
                        value () { return     _that.getDatePickerData(30)    }
                    },
                    {
                        text: '最近三个月',
                        value () { return     _that.getDatePickerData(90)    }
                    }
                ]
            }
            // 搜索验证
            // searchRules: {
            //     memberPhone: [
            //         {validator: this.phoneCheck, trigger: 'blur'}
            //     ]
            // },
        }
    },
    watch: {
        formSearch: {
            handler (nv, ov) {
                this.$nextTick(() => {
                    let num = parseInt((nv.memberPhone + '').replace(/[^\d]/g, ''))
                    if (isNaN(num)) {
                        this.formSearch.memberPhone = ''
                    } else {
                        this.formSearch.memberPhone = num
                    }
                })
            },
            deep: true
        }

    },
    methods: {
        search () {
            this.$refs.formSearch.validate(valid => {
                if (!valid) { return    }
                this.$emit('search', this.formSearch)
            })
        },
        getDatePickerData (day) {
            const end = new Date()
            const start = new Date()
            start.setTime(start.getTime() - 3600 * 1000 * 24 * day)
            return [start, end]
        }
    }
}
</script>

Answer 1

在formSearch中添加对应属性就可以了

Answer 2

 FormItem(label="手机号" prop="memberPhone")

改为

 FormItem(label="手机号")

可以吗