- 22
- 0
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> 0
打赏
收藏
点击回答
网站公告
- 扫一扫访问手机版
回答动态

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题函数计算不同地域的是不能用内网吧?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题在ARMS如何申请加入公测呀?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的,这个init方法在哪里进行添加?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器刚到期,是不是就不能再导出存档了呢?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了,怎么办?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了,怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了,是什么情况?预计能赚取 0积分收益
- 回到顶部
- 回到顶部
