vue

问题1：列表数据带到form页面修改之后，点击取消，列表页面随之修改

希望达到的效果：form表单修改之后，点击取消，不会带动列表数据的修改

修改方法：

JSON.parse(JSON.stringify(data));

 问题二：返回之前的页面

this.$router.back()

 问题三：防止多次点击，重复请求

//1.添加自定义文件 preventReClick.js
import Vue from 'vue'

const preventReClick = Vue.directive('prevent-re-click', {
    inserted: function (el, binding) {
        el.addEventListener('click', () => {
            if (!el.disabled) {
                el.disabled = true
                setTimeout(() => {
                    el.disabled = false
                }, binding.value || 3000)
            }
        })
    }
});

export { preventReClick }

//2.在main.js中引入
import preventReClick from './store/preventReClick' //防多次点击，重复提交

//3.使用
<el-button class="common-button" size="small" type="primary" @click="handleSave('form')" v-prevent-re-click>保 存</el-button>

 this.$forceUpdate()

问题4：返回取消校验

this.$refs.form.clearValidate();