天天看点

vue清空子组件数据或强制刷新子组件

需求:每次点开子页面的时候,里面的表单内容都为空

this.$refs[‘form’].resetFields()

1、可以通过ref把表单数据绑定上

vue清空子组件数据或强制刷新子组件

在data中定义form写入对应key和value(每个input输入的值)

vue清空子组件数据或强制刷新子组件
  • 在点击按钮打开子组件的时候是触发这个语句,这样每次打开表单数据都是空的,
  • 当然如果想表单输入一半关掉但不希望表单内容清空就不能用上面那句话的写法了,只需要在表单提交成功之后写入这句话就好了

2、可以给定一个v-if 通过其特性来强制刷新页面

vue清空子组件数据或强制刷新子组件

这个是引入的子组件和写在同一个文件里的差不多,在父元素上写v-if 在data中写入showCard=false,这样在点击展开子组件按钮的方法里只需要写入this.$nextTick(() => (this.showSetUp = true)) 即可,每次打开页面都会强制刷新

vue