vue 中表单置空简单操作

在vue单文件组件里有时需要重置data中的数据,比如表单填写一半,用户想重新填写。或者新增成功后,再次信息,打开弹框,希望之前填写的内容清空,发现一个简单写法:this.form = this.$options.data().form;(form为你要清空的表单)

<script>
    export default {
        data() {
            return {
                // 表单
                form: {
                    input: ''
                }
            }
        },
        ...
        methods: {
            // 重置表单方法
            retset() {
                this.form = this.$options.data().form;
            }
        },
        ...
    }
</script>

vue组件可以通过 this.$options 对象获取你编写的任何方法,比如 created( ) 生命周期函数

posted @ 2021-01-15 10:50  shetoutou  阅读(2131)  评论(0编辑  收藏  举报