<form action="{{route('admin.node.update',$node)}}"  class="layui-form" id="form-node-edit" @submit.prevent="doPost">
                <div class="layui-form-item">
                    <label  class="layui-form-label">
                        <span class="x-red">*</span>是否顶级菜单</label>
                    <div class="layui-input-inline">
                        <select  name="pid" class="select" @change="changePid" v-model="pid">
                            <option  value="0">==顶级菜单==</option>
                            @foreach($data as $item)
                                <option value="{{$item->id}}">{{$item->name}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label  class="layui-form-label">
                        <span class="x-red">*</span>节点名称</label>
                    <div class="layui-input-inline">
                        {{--v-model.lazy vue.js 延时绑定--}}
                        <input type="text"  name="name"  class="layui-input" v-model.lazy="info.name" v-model="name">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label  class="layui-form-label">路由别名</label>
                    <div class="layui-input-inline">
                        <input type="text"  name="route_name"   class="layui-input" v-model.lazy="info.route_name" v-model="route_name">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><span class="x-red">*</span>是否菜单</label>
                    <div class="layui-input-block">
                        <input type="radio" name="is_menu" v-model="is_menu" value="0" v-model.lazy="info.is_menu" lay-skin="primary" title="否">
                        <input type="radio" name="is_menu" v-model="is_menu" value="1" v-model.lazy="info.is_menu" lay-skin="primary" title="是" checked="">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label  class="layui-form-label"></label>
                    <button class="layui-btn">确认修改</button>
                </div>
            </form>
 <script src="/admin/js/vue@2.6.11.js"></script> 
    <script>
        const _token = "<?php echo e(csrf_token()); ?>";
        new Vue({
            el: '#form-node-edit',
            data:{
                info:{
                    name: "{{$node->name}}",//给后端传值
                    pid:"{{$node->pid}}",
                    route_name:"{{$node->route_name}}",
                    is_menu: "{{$node->is_menu}}",
                    _token:_token
                }
            },
            created(){//初始化赋值
                this.pid = "{{$node->pid}}";
                this.name = "{{$node->name}}";
                this.route_name = "{{$node->route_name}}";
                this.is_menu = "{{$node->is_menu}}";
            },
            methods:{
                /*doPost(evt){
                    let url = evt.target.action;
                    $.post(url, this.info).then(ret => {
                        console.log(ret)
                    });
                }*/
                //异步变同步 es7 async await
                async doPost(evt){
                    let url = evt.target.action;
                    $.ajax({
                        'url':url,
                        'data':this.info,
                        'type': 'PUT'
                    }).then(ret => {
                        if(ret.status== 0) {
                            layer.msg(ret.msg,{icon:1,time:2000}, ()=> {
                                location.href = "{{route('admin.node.index')}}";
                            });
                        } else {
                            layer.msg(ret.msg,{icon:2,time:2000});
                        }
                    });
                },
                changePid(evt){//select 赋值
                    this.info.pid = evt.target.value || 0;
                }
            },
            /*  created:在模板渲染成html前调用，即通常初始化某些属性值，然后再渲染成视图。
                mounted:在模板渲染成html后调用，通常是初始化页面完成后，再对html的dom节点进行一些需要的操作。*/
            mounted(){
                /* 单选样实*/
                layui.use(['form'], function () {
                    var form = layui.form;
                    // 监听全选
                    form.on('checkbox(checkall)', function (data) {
                        if (data.elem.checked) {
                            $('tbody input').prop('checked', true);
                        } else {
                            $('tbody input').prop('checked', false);
                        }
                        form.render('checkbox');
                    });
                });
            }
        });
    </script>