vue.js - 怎么把弹出层数据添加到数组的对象元素里？

问题描述

问 题

<script type="text/javascript">
    var obj={
        grid: [
            {id: "1", name: "admin", tel: "12345678901",   createtime: "2016-11-28"},
            {id: "2", name: "Jack", tel: "12345678901", createtime: "2016-11-28"},
            {id: "3", name: "Tom", tel: "12345678901",    createtime: "2016-11-28"},
        ]
    };
    new Vue({
        el:"#app",
        data:obj,
        nickname:'',
        methods:{
            add:function () {
                layer.open({
                    type:1,
                    area:['400px','400px'],
                    title:'添加管理员',
                    shade:0.6,
                    anim:2,
                    content:'<div style="width: 200px;height: 300px;margin: 0 auto;padding-top: 30px">' +
                    '<div><div style="text-align: left; margin-bottom: 10px">用户ID：</div><input type="text"     required value="" id="managerid"></div>' +
                    '<div><div style="text-align: left; margin-bottom: 10px">用户名：</div><input type="text"      required value=""  id="managername"></div>' +
                    '<div><div style="text-align: left; margin-bottom: 10px">手机号：</div><input type="text"      required value=""  id="managertel"></div>' +
                    '<div><div style="text-align: left; margin-bottom: 10px">创建时间：</div><input type="datetime" required value="" id="createtime"></div>' +
                    '</div>',
                    btn:['添加','取消'],
                    **yes : function(index,layero) {
                        this.data.push('{id:'+ $('#managerid').val()+', name: '+$('#managername').val()+', tel: '+$('#managertel').val()+',    createtime:'+$('#createtime').val()+'}');
                        console.log(this.grid);
                        layer.close(index);

                    },**

                });
            },
});

问题：![图片描述][1]

yes函数里面有问题。不知道怎么写？

解决方案

<script type="text/javascript">
    var obj={
        grid: [
            {id: "1", name: "admin", tel: "12345678901",   createtime: "2016-11-28"},
            {id: "2", name: "Jack", tel: "12345678901", createtime: "2016-11-28"},
            {id: "3", name: "Tom", tel: "12345678901",    createtime: "2016-11-28"},
        ]
    };
    var vm=new Vue({
        el:"#app",
        data:function () {
            return obj
        },

        methods:{
            add:function () {
                layer.open({
                    type:1,
                    area:['400px','400px'],
                    title:'添加管理员',
                    shade:0.6,
                    anim:2,
                    content:'<div style="width: 200px;height: 300px;margin: 0 auto;padding-top: 30px">' +
                    '<div><div style="text-align: left; margin-bottom: 10px">用户ID：</div><input type="text"     required value="" id="managerid"></div>' +
                    '<div><div style="text-align: left; margin-bottom: 10px">用户名：</div><input type="text"      required value=""  id="managername"></div>' +
                    '<div><div style="text-align: left; margin-bottom: 10px">手机号：</div><input type="text"      required value=""  id="managertel"></div>' +
                    '<div><div style="text-align: left; margin-bottom: 10px">创建时间：</div><input type="datetime" required value="" id="createtime"></div>' +
                    '</div>',
                    btn:['添加','取消'],
                    yes : function(index,layero) {
                        vm.grid.push({id:$('#managerid').val(), name: $('#managername').val(), tel:$('#managertel').val(), createtime:$('#createtime').val()});
                        layer.close(index);
                    },
                });
            },

这篇关于vue.js - 怎么把弹出层数据添加到数组的对象元素里？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！