layui动态添加的表单元素显示异常

这种问题发生的原因：layui会对表单内的元素进行二次渲染，动态添加的代码没有经过再次渲染，所以显示异常。

官方文档其实也有提及这个问题和解决方法

https://www.layui.com/doc/modules/form.html#render

解决方法：动态添加元素后，使用form.render()手动触发渲染，如下代码所示：

layui.use(['form'], function () {
        var $ = layui.jquery,
            form = layui.form,
            table = layui.table;

        //监听radio选中事件，与本文无关
        form.on('radio(test)', function (obj) {
            //动态添加元素
            addThing(obj.value)
            //执行渲染
            form.render('radio')
        });
    });

另外附上layui动态添加radio元素的方法：

 function addThing(radioGroup, data) {
        radioGroup[0].innerHTML = ""
        if (data.length == 0) return;

        var tt = "<input type=\"radio\" name=\"thing\" value=\""+data[0].tname+"\" title=\""+data[0].tname+"\" checked=\"\"><div class=\"layui-unselect layui-form-radio layui-form-radioed\"><i class=\"layui-anim layui-icon\">&#xe643</i><div>"+data[0].tname+"</div></div>"
        radioGroup[0].innerHTML += tt
        for (var i = 1; i < data.length; i++) {
            var temp = data[i].tname
            tt = "<input type=\"radio\" name=\"thing\" value=\""+data[i].tname+"\" title=\""+data[i].tname+"\"><div class=\"layui-unselect layui-form-radio\"><i class=\"layui-anim layui-icon\">&#xe63f</i><div>"+data[i].tname+"</div></div>";
            radioGroup[0].innerHTML += tt
        }
    }