layui监听表单提交出现的坑-layedit

问题描述

前端使用了layui框架，我现在需要在前端提交一个表单到后端保存，正常保存没有问题，现在我添加进来了layedit，使用layedit渲染了textarea，我现在想使用了form监听submit功能，然后手动发起ajax请求完成前后端分离，就在此时发生了bug，bug代码段如下：

form.on('submit(submitBtn)', function(data){
            var con = layedit.getContent(index)
            $('#LAY_demo1').val(con);
            if (con===""){
                layer.msg("文章不能为空！")
                return false;
            }
            $.ajax({
                url:"/admin/article/save",
                type:"post",
                contentType:"application/json;charset=utf-8",
                data:JSON.stringify(data.field),
                success:function (res) {

                }
            })
            return false;
        });

看上去没有错，但是就是因为textarea不能自动获取layedit中的值，需要手动传入，然后就引发了bug，每次提交获取到的都是上一次的值？？？
思考了很久认为赋值过程中是不是有异步操作引起了延迟，但是看几遍都认为没有异步，非常奇怪，于是尝试了layui自带的传值到textarea（layedit.sync(index)）,效果不出所料，一样bug
在分析了很久之后判断出了问题，监听接收的data参数不能实时更新导致获取的永远都是上一次的，不出所料，换成了form.val(‘ArticleForm’)的形式来获取form表单，bug消失，代码如下：

form.on('submit(submitBtn)', function(data){
            var con = layedit.getContent(index)
            $('#LAY_demo1').val(con);
            if (con===""){
                layer.msg("文章不能为空！")
                return false;
            }
            $.ajax({
                url:"/admin/article/save",
                type:"post",
                contentType:"application/json;charset=utf-8",
                data:JSON.stringify(form.val("ArticleForm")),  //此处传值不能通过data获取，否则永远都是赋值之前的，即
                success:function (res) {

                }
            })
            return false;
        });

总结：监听事件携带的数据，如果修改不能自动获取最新的，是旧的数据，不同于拿地址，而是类似拿的静态数据